Hello all,
I was hoping someone would be able to shed some light on what I'm doing wrong with a piece of javascript.
I've been teaching myself html and css, and have set up a holding page for myself. I wanted to add a bit javascript which would change the background of the page as the user moves the mouse. So, as the cursor moves from top to bottom, the background colour smoothly fades from one hue to another.
At the moment I have this from playing around with a jfiddle I found:
However, I'm not sure how to put it in the html page correctly, at the moment it's in the document <body>.Code:var $win = $(window), w = 0,h = 0, rgb = [], getWidth = function() { w = $win.width(); h = $win.height(); }; $win.resize(getWidth).mousemove(function(e) { rgb = [ Math.round(e.pageX/w * 255), Math.round(e.pageY/h * 255), 150 ]; $(document.body).css('background','rgb('+rgb.join(',')+')'); }).resize();
Do I need to do anything in the <style> section to specify that I want the javascript to decide the background colour?
I hope that makes sense. Thanks for your help!


LinkBack URL
About LinkBacks
Reply With Quote
).
