div滚动jquery动画不光滑

我已经把我的示例工作代码在http://jsfiddle.net/ULeuu/1/。问题是我试图使用jQuery进行动画制作，但滚动并不平滑。有没有一种办法，这样我可以让DIV滚动顺畅div滚动jquery动画不光滑

2011-12-20 user850234

你能详细点吗？您正在使用哪个浏览器？什么版本的jQuery？ – Shades88 2011-12-20 09:14:07

我想他是说如果鼠标按住下，它应该连续滚动，不滚动，停止，滚动和停止等。 – Purag 2011-12-20 09:18:01

@ShantanuD我想要Purmou指出的方式 – user850234 2011-12-20 09:32:03

insted的的fast给在.animate一定的价值像

$("#slide").stop().animate({"left":leftVal + 177 + 'px'},1000);

来源

2011-12-20 09:15:51 xyz

这只会让速度变慢。如果你注意到，动画在中途暂停很短暂。这就是他想要摆脱的。 – Purag 2011-12-20 09:19:41

@Ajinkya我已经试过这个，但是无法摆脱Purmou提到的 – user850234 2011-12-20 09:32:57

首先，同步setTimeout的和.animate()的持续时间延长设置动画持续时间为400，如超时。

二，使用linear宽松政策以消除任何动画堆栈：

$("#slide").stop().animate({"left":leftVal + 177 + 'px'}, { "duration": 400, "easing": "linear" });

Demo。

来源

2011-12-20 09:21:13 Samich

我已经看到了你所做的更正，但是在滚动期间存在某种视觉失真。我已经尝试过，但没有得到滚动插件的工作效果。它可以随着视觉清晰度而变得平滑，否则在触摸设备中，轻微的视觉差异更加明显。 – user850234 2011-12-20 09:46:38

悬停时连续滚动的目标是？
使用与您的动画具有相同时间量的setInterval，并使用线性缓动。
- 使用jQuery 1.9.1

(function(){ 
       var myObject = { 
        leftInt: '', 
        rightInt: '', 
        init: function(){ 
         $this = this; 
         $(function(){ 
          $this.eventListeners(); 
         }); 
        }, 
        eventListeners: function(){ 
         $('#prev').on("mouseenter", myObject.goLeft); 
         $('#prev').on("mouseleave", myObject.stopLeft); 
         $('#next').on("mouseenter", myObject.goRight); 
         $('#next').on("mouseleave", myObject.stopRight); 
        }, 
        goLeft: function(){ 
         myObject.leftInt = setInterval(myObject.slideLeft, 300); 
        }, 
        goRight: function(){ 
         myObject.rightInt = setInterval(myObject.slideRight, 300); 
        }, 
        stopLeft: function(){ 
         clearInterval(myObject.leftInt); 
        }, 
        stopRight: function(){ 
         clearInterval(myObject.rightInt); 
        }, 
        slideLeft: function(){ 
         $("#slide").stop(true, true).animate({"left":'+=20px'}, 300, 'linear'); 
        }, 
        slideRight: function(){ 
         $("#slide").stop(true, true).animate({"left":'-=20px'}, 300, 'linear'); 
        } 
       } 
       myObject.init(); 
      })();

来源

2013-02-12 23:23:47

div滚动jquery动画不光滑

回答

相关问题