javascript - change background color with change in mouse position -

i wondering if possible set background-color of mouse coordinates.

what have is:

i have div-a draggable , other divs droppable.

what need :

i need highlight other divs on page droppable, whenever div-a passes on them. have mouse coordinates, possible apply css on bases of mouse coordinates using jquery.

something following may work. need deal window's scrollleft , scrolltop perfect. want throttle , memoize (if drop positions don't change) too.

also, more performance can tweaked out of caching offset(), binding mousemove when needed, , tweaking each loop utilize optimized loop (e.g. for(var i=droppables.length;i>-1;){var self = droppables.eq(--i);...}).

also note change color of divs when mouse passes on them...not when draggable passes on them...this makes things little more complicate function below should send in right direction.

$(document).mousemove(function(e){      // should throttled...      var x = e.pagex,          y = e.pagey;      // loop optimized...      $("div.droppables").each(function(){          // these vars memoized...          var self = $(this),              divl = self.offset().left,              divt = self.offset().top,              divr = self.width() + divl,              divb = self.height() + divt;          // if mouse coords between droppable's coords          // change background color          if(x >= divl && x <= divr && y >= divt && y <= divb){               self.css("background", "red");          }          else{               // reset background color               self.css("background", "");             }      }); });