Revision: 68940
Updated Code
at March 24, 2015 01:01 by miha
Updated Code
// EXAMPLE: // http://jsfiddle.net/vvvvvv/3r0wLk5L/ // https://addons.mozilla.org/ru/firefox/addon/pixel-perfect/ (function(){ var CONFIG = { // Change to real path/to/image.png path: 'image.png', // Change to height of background image height: '400', // Preferred key binding keys: 'alt+q', }; function loadExtScript(src,test,callback) { if(window.jQuery) { callback(); } else { var s = document.createElement('script'); s.src = src; document.body.appendChild(s); var callbackTimer = setInterval(function(){ var call = false; try { call = test.call(); } catch(e) {} if(call) { clearInterval(callbackTimer); callback.call(); } },100); } } loadExtScript('https://yandex.st/jquery/2.1.1/jquery.min.js',function(){ return (typeof $ == 'function'); },function(){ $(function(){ $.ajax({ type: 'GET', url: 'https://rawgit.com/jeresig/jquery.hotkeys/master/jquery.hotkeys.js', dataType: 'script', success: function(){ $('body').prepend('<div id="pixp" style="background: url('+CONFIG.path+') top center no-repeat; position: absolute; width: 100%; top: '+parseInt($('body').css('margin-top'))+'px; height: '+CONFIG.height+'px; opacity: .5; z-index: -1;"></div>'); $('#pixp').css({ 'width': ( $('body').width() - ( parseInt($('body').css('margin-left')) + parseInt($('body').css('margin-right')) ) )+'px', 'padding': $('body').css('margin'), }); $(document).bind('keydown',CONFIG.keys,function(){ if($('#pixp').css('opacity') == 1) { $('body > *').fadeTo(0,1); $('#pixp').fadeTo(0,0.5); } else { $('body > *').fadeTo(0,0.5); $('#pixp').fadeTo(0,1); } }); }, }); }); }); })();
Revision: 68939
Initial Code
Initial URL
Initial Description
Initial Title
Initial Tags
Initial Language
at March 23, 2015 20:16 by miha
Initial Code
// EXAMPLE: // http://jsfiddle.net/vvvvvv/3r0wLk5L/ // https://addons.mozilla.org/ru/firefox/addon/pixel-perfect/ (function(){ var CONFIG = { // Change to real path/to/image.png path: 'image.png', // Change to height of background image height: '400', // Preferred key binding keys: 'alt+q', }; function loadExtScript(src,test,callback) { if(window.jQuery) { callback(); } else { var s = document.createElement('script'); s.src = src; document.body.appendChild(s); var callbackTimer = setInterval(function(){ var call = false; try { call = test.call(); } catch(e) {} if(call) { clearInterval(callbackTimer); callback.call(); } },100); } } loadExtScript('https://yandex.st/jquery/2.1.1/jquery.min.js',function(){ return (typeof $ == 'function'); },function(){ $(function(){ $.ajax({ type: 'GET', url: 'https://rawgit.com/jeresig/jquery.hotkeys/master/jquery.hotkeys.js', dataType: 'script', success: function(){ $('body').prepend('<div id="pixp" style="background: url('+CONFIG.path+') top center no-repeat; position: absolute; top: '+parseInt($('body').css('margin'))+'px; width: '+($('body').width()-parseInt($('body').css('margin'))*2)+'px; height: '+CONFIG.height+'px; opacity: .5; z-index: -1;"></div>'); $(document).bind('keydown',CONFIG.keys,function(){ if($('#pixp').css('opacity') == 1) { $('body > *').fadeTo(0,1); $('#pixp').fadeTo(0,0.5); } else { $('body > *').fadeTo(0,0.5); $('#pixp').fadeTo(0,1); } }); }, }); }); }); })();
Initial URL
http://jsfiddle.net/vvvvvv/3r0wLk5L/
Initial Description
Pixel Perfect technique with jQuery
Initial Title
Pixel Perfect technique with jQuery
Initial Tags
Initial Language
JavaScript