Skip to content

Instantly share code, notes, and snippets.

@samsargent
Last active June 1, 2016 12:55
Show Gist options
  • Star 2 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save samsargent/5260160 to your computer and use it in GitHub Desktop.
Save samsargent/5260160 to your computer and use it in GitHub Desktop.
Bookmarklet - simply show the view-port width to make it easy to see what media-query is being used.
javascript:((function(){var e=document.createElement("div");e.style.position="fixed";e.style.height="50";e.style.width="300";e.style.margin="-25px -150px 0 0";e.id="unitseven-size";e.style.top="50%";e.style.left="50%";e.style.zIndex="1000";e.style.padding="5px 10px 5px 10px";e.style.backgroundColor="#000";e.style.color="#fff";e.innerHTML="Size Here";var t=document.getElementsByTagName("body")[0];t.appendChild(e);var n=document.getElementById("unitseven-size");n.innerHTML=document.documentElement.clientWidth;window.onresize=function(e){n.innerHTML=document.documentElement.clientWidth}})())();
/* Responsinator Bookmarklet - simply show the viewport width to make it easy to see what media-query is being applied.
*/
(function(){
var el=document.createElement('div');
el.style.position='fixed';
el.style.height='50';
el.style.width='300';
el.style.margin='-25px -150px 0 0';
el.id='unitseven-size';
el.style.top='50%';
el.style.left='50%';
el.style.zIndex = '1000';
el.style.padding='5px 10px 5px 10px';
el.style.backgroundColor='#000';
el.style.color="#fff";
el.innerHTML="Size Here";
var b=document.getElementsByTagName('body')[0];
b.appendChild(el);
var d=document.getElementById('unitseven-size');
d.innerHTML = document.documentElement.clientWidth;
window.onresize = function(event) {
d.innerHTML = document.documentElement.clientWidth;
};
})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment