animation - jQuery Animate not working on mouse move -


i'm working on animated image gallery can see in fiddle here jquery, has few features:

  1. hover on category reveal images in category
  2. click image change load in full size display
  3. when mouse on right hand or left had side of screen, list of images displaying scrolls left or right accordingly.

steps 1 , 2 work fine, item number 3 animations not working, first time working animations in jquery , have been pulling hair out.... can see goin wrong?

this code detecting mouse position (works fine) , animating accordingly (doesn't work)

    $(document).mousemove(function(e) {       var mx = e.pagex;     var width = $(window).width();     var buffer = parseint(width) / 3;     var rightbuf = width - buffer;     var leftbuf = rightbuf - buffer;     if(mx > rightbuf){         $('.menu-sub').animate({ "left": "-50px" }, "slow" );     }else if(mx < leftbuf){         $('.menu-sub').animate({ "left": "50px" }, "slow" );               }else{      } }); 

to move image list can use

$('.menu-sub ul').animate({ "margin-left": "-=50px" }, "slow" ); 

but should not use .mousemove() because called every time mouse moves 1 pixel. use hidden divs , bind hover have done headings. in mouseover event execute

hovering = true; while (hovering) { // animate } 

and set hovering false in mouseout event.

i updated fiddle @ least wait second before scrolling again: http://jsfiddle.net/3xkbmo8p/16/


Comments

Popular posts from this blog

matlab - "Contour not rendered for non-finite ZData" -

delphi - Indy UDP Read Contents of Adata -

javascript - Any ideas when Firefox is likely to implement lengthAdjust and textLength? -