开发者

jQuery scrollTo, div not scrolling

I'm trying to use the scrollTo plugin for jQuery in order to scroll certain content horizontally:

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);
  });

I've tried applying scrollTo in so many ways now I begin to wonder if it's even compatible with the latest version of jQuery, which I'm using. There are no JavaScript errors showing up and I can get an alert or similar to be called inside the link functions, but #content does not want to 开发者_如何学Gomove. Am I missing something here?


The css 'left' property won't do anything unless it's position: relative, fixed, or absolute. Also, you can use .animate() instead of .scrollTo, because it sounds like whatever plugin you installed is simply extraneous.

Try this jsfiddle: http://jsfiddle.net/ndz5K/4/

I just changed (1) #content's CSS to relative, and (2) .scrollTo() to .animate()


Yes, include the following code snippet,

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

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜