html - Screen burn prevention javascript program -
this question has answer here:
- uncaught referenceerror: $ not defined? 31 answers
i creating information kiosk display production information. screen on constantly. while information contained within large table refreshed periodically, want pass line through screen periodically reduce screen burn effect. found code, , it's want do, cannot work:
i created simple html page.when check developer console, following error: referenceerror: $ not defined.
i new javascript, , have been trying figure out how incorporate code page.
var $burnguard = $('<div>').attr('id','burnguard').css({ for bit of code above, have specify either 'div' or make div in page , give id? page have include link jquery? appreciated.
you missing reference jquery. here code need. sho know can add /show end of jsfiddle url , right click choose view frame source see code behind result!
<html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <title> - jsfiddle demo bradchristie</title> <script type='text/javascript' src='http://code.jquery.com/jquery-1.4.4.min.js'></script> <style type='text/css'> </style> <script type='text/javascript'>//<![cdata[ $(window).load(function(){ var $burnguard = $('<div>').attr('id','burnguard').css({ 'background-color':'#ff00ff', 'width':'1px', 'height':$(document).height()+'px', 'position':'absolute', 'top':'0px', 'left':'0px', 'display':'none' }).appendto('body'); var colors = ['#ff0000','#00ff00','#0000ff'], color = 0, delay = 5000, scrolldelay = 1000; function burnguardanimate() { color = ++color % 3; var rcolor = colors[color]; $burnguard.css({ 'left':'0px', 'background-color':rcolor, }).show().animate({ 'left':$(window).width()+'px' },scrolldelay,function(){ $(this).hide(); }); settimeout(burnguardanimate,delay); } settimeout(burnguardanimate,delay); });//]]> </script> </head> <body> </body> </html>
Comments
Post a Comment