Chrome

Posts marked with "Chrome" in tags

Running JavaScript code & Getting Result from Go using V8 Engine

July 17, 2022 Tech

I have a VueJS app, I want to make the <title> and <meta> tags to be populated in page source itself for better SEO.

I could use Server Side Rendering but it was difficult, express.js keeps crashing and there’s JavaScript inconsistencies (ES Module imports didn’t work in node). More explanation at the very bottom.

To solve this problem, I did something wild.

I made a Go server, served the JS app. On each request, the HTML file is processed by Go and title, meta tags are dynamically populated, rest of the page is just another VueJS app.

... [READ MORE]

Disable Cache For Web Development In Chrome

February 27, 2014

If you’re developing a web page in Chrome and some changes you applied to code doesn’t take effect on the page, you will be angry. You will look and look into the code for errors. But it’s not the problem with your code. It’s the problem with the browser.

The resources loaded on the page are cached. Hence the changes made to the code won’t be applied. So, you need some way to disable the cache. If you look around the Chrome Settings page, you will see an option – it’s Clear Browsing Data. If you do this, you will clear the entire cache. Even the website which you want the cache (like Facebook, Google +).

... [READ MORE]

How To Check If Internet Connection Exists In jQuery & Javascript

October 18, 2013 JavaScript, JQuery

If you are running an app on the web that requires Internet Connection all the time, sometimes the internet connection will fail on the client side and your app won’t properly work. The best example is the New Tab Chrome Apps that will display the URL icons grayscale when offline and will make the icons back to color when online. To check whether the client’s internet connection is online, we use jQuery. You can also use Javascript to check. I will tell you how to do the checking in both jQuery and Javascript.
The checking is simple. We will send a request to one of the site’s image. If the request was successful, the Internet Connection is active and if it’s not successful, there isn’t any active Internet Connection. It’s as simple as that. The following modal will make you understand the concept easily :

... [READ MORE]

Better Google Chrome History Page

August 5, 2013

As you know, Google Chrome‘s Browser History is not efficient. It’s history is not like any other browsers. I think they made the History page in a hurry. If we want to search for a page we visited before, we won’t get it by searching on History page. That’s the main problem.
This problem was solved when a lot of users created an alternate History Page extension on Chrome Webstore.
In this post I’m gonna tell the most used History Alternate Extension. It’s Better History extension. You can download the extension from here.

Deleting:

... [READ MORE]

Advanced Rest Client : Create and Test custom HTTP requests.

June 8, 2013

I recently noticed a Google Chrome Webstore app that can be used for making a request to a web site or local site. I loved the app from the beginning. You can send a request to any site with header data, form data etc…

You can also attach a file to the form. Ain’t that Awesome.
Every web developer must have this app. Install it from Chrome Webstore

Features

– Integrated with Google Drive
– It’s own backend service to store and share data between coworkers
– convenient HTTP headers and payload editor thanks CodeMirror
– Make a HTTP request (via XmlHttpRequest level 2)
– Debug socket (via web socket API).
– JSON response viewer
– XML response viewer
– set custom headers – even does not supported by XmlHttpRequest object
– help with filling HTTP headers (hint + code completion)
– add headers list as raw data or via form
– construct POST or PUT body via raw input, form or send file(s) with request
– set custom form encoding
– remember latest request (save current form state and restore on load)
– save (Ctrl+S) and open (Ctrl+O) saved request forms
– history support
– data import/export

... [READ MORE]

How to check if the mouse is over an element in jQuery?

April 28, 2013 JavaScript, JQuery

Here is a simple plugin to check if the mouse is over an element in JQuery. Open your jQuery source file and search for window.jQuery = window.$ = jQuery;

Paste the code shown below after the code you have just found.

$.mlp ={x:0,y:0};function documentHandler(){var $current =this=== document ? $(this): $(this).contents(); $current.mousemove(function(e){jQuery.mlp ={x:e.pageX,y:e.pageY}}); $current.find("iframe").load(documentHandler);}$(documentHandler); $.fn.ismouseover =function(overThis){var result =false;this.eq(0).each(function(){var $current = $(this).is("iframe")? $(this).contents().find("body"): $(this);var offset = $current.offset(); result result = offset.left<=$.mlp.x && offset.left + $current.outerWidth()> $.mlp.x && offset.top<=$.mlp.y && offset.top + $current.outerHeight()> $.mlp.y;});return result;};
... [READ MORE]

Make Image Black & White (grayscale) using CSS In Webkit

November 2, 2012 CSS, HTML

If you want to make images grayscale ie black & white you can use this tutorial.

Note that this trick will only work on browsers that runs webkit which is used by browsers like Google Chrome, Safari, Midori etc.

Other browsers using different engines do not support the gray scake option. Hence this trick does not support all browsers.

DEMO

Grayscaled Image Using CSS & Original Image

Here’s the CSS code which will make all images grayscale.

... [READ MORE]

Running JavaScript code & Getting Result from Go using V8 Engine

Disable Cache For Web Development In Chrome

How To Check If Internet Connection Exists In jQuery & Javascript

Better Google Chrome History Page

Advanced Rest Client : Create and Test custom HTTP requests.

Features

How to check if the mouse is over an element in jQuery?

Make Image Black & White (grayscale) using CSS In Webkit

Follow/Subscribe

Subdomains

Past