August 6, 2018

Browser Badge Bookmarketlet

When taking browser screenshots, it's helpful to identify the browser that you're using. One way to highlight the browser is to put a browser banner in the browser before taking a screenshot.

I created a bunch of sport banner-like images of all the popular browsers. Using some JavaScript and Bookmarklets it's easy to do.

2018 Browser Banner

Visit the QA Page to get all the banner image.

Chrome

Drag and drop the "Chrome Banner" link to your bookmark bar to add a Chrome Banner overlay to any page your looking at.

javascript:(function(){document.body.innerHTML += '<img src="[http://www.cryan.com/qa/banners/ChromeBanner.png](http://www.cryan.com/qa/banners/ChromeBanner.png)" style="position: fixed; left: 10px; bottom: 10px; z-index: 1000">';})();

FireFox

Drag and drop the "Firefox Banner" link to your bookmark bar to add a FireFox Banner overlay to any page your looking at.

javascript:(function(){document.body.innerHTML += '<img src="[http://www.cryan.com/qa/banners/FirefoxBanner.png](http://www.cryan.com/qa/banners/FirefoxBanner.png)" style="position: fixed; left: 10px; bottom: 10px; z-index: 1000">';})();

Comments

Add your Comments

Feel free to leave a comment about this post.

- Feel Free to add HTML to your comment!