jQuery的scrollTo，div不滚动

Question

我正在尝试使用 jQuery 的scrollTo插件来水平滚动某些内容：

HTML

<a id="back">Back</a>
<div id="placeholder">
    <div id="content">Content goes here</div>
</div>
<a id="forward">Forward</a>

CSS

#placeholder { width: 640px; height: 480px; overflow: hidden; }
#content { width: 9999em; }

JavaScript

  $("#back").click(function(){
    $('#content').scrollTo({left:'-=100px'} , 500);
  });
  $("#forward").click(function(){
    $('#content').scrollTo({left: '+=100px'} , 500);
  });

我已经尝试以多种方式应用scrollTo，现在我开始怀疑它是否与最新版本的jQuery兼容，我正在使用。没有出现 JavaScript 错误，我可以收到警报或类似的链接函数内调用的内容，但 #content 不想移动。我在这里错过了什么吗？

Answer 1

css 'left' 属性不会执行任何操作，除非它的位置是：相对、固定或绝对。另外，您可以使用 .animate() 而不是 .scrollTo，因为听起来您安装的任何插件都是无关紧要的。

试试这个 jsfiddle： http://jsfiddle.net/ndz5K/4/

我刚刚更改了 (1) #content 的 CSS 为relative，以及 (2) .scrollTo() 为 .animate()

Answer 2

是的，包括以下代码片段，

$("#clickhere").click(function() {
    $('html, body').animate({
        scrollTop: $("#scrolltodiv").offset().top
    }, 2000);
   return false;
});