0

I'm using on my website a JS to change the background color depending on the mouse position.

here is the JS :

$(document).mousemove(function(e){
   var $width = ($(document).width())/255;
    var $height = ($(document).height())/255;
    var $pageX = parseInt(e.pageX / $width,10);
    var $pageY = parseInt(e.pageY / $height,10);
    $("body").css("background-color", "rgb("+$pageY+","+$pageX+","+$pageY+")");
});

it works fine, but I can't define the colors I want, unless I try to change the calculs but It's really not precise and random ...

here is a jsfiddle : http://jsfiddle.net/BrZjJ/33/

what I would like is that the background changes color using the same X and Y position, but between two fixed color RGB (252,2,252) and RGB (23,253,23).

when mouse is top left RGB (252,2,252), and when mouse is bottom right RGB (23,253,23), and color progressivly changing from first color to second color when moving mouse.

I can't find anything on the net to do this... can anybody help me with this ? thanks for your help

mmdwc
  • 1,095
  • 6
  • 27
  • 53

0 Answers0