[英]Auto-Scroll div horizontally to the very end with overflow-y set to scroll (jQuery)
我正在使用这个 jQuery 脚本,它根据div的宽度自动水平滚动div 。 但是我需要它根据 div 内部内容的末尾滚动到 div 的最后。 div 有一个 'overflow-y: scroll' 属性,所以我希望它滚动浏览所有内容,直到它到达结尾。
这是我目前使用的脚本:
function animatethis(targetElement, speed) {
var width = $(targetElement).width();
$(targetElement).animate({ marginLeft: "-="+width},
{
duration: speed,
complete: function ()
{
targetElement.animate({ marginLeft: "+="+width },
{
duration: speed,
complete: function ()
{
animatethis(targetElement, speed);
}
});
}
});
};
animatethis($('#q1'), 5000);
它确实会滚动,但不会滚动到 div 内内容的最末端。 这是一个 jFiddle,显示了我的意思: http : //jsfiddle.net/rKu6Y/535/
我怎样才能让它水平自动滚动到内容的 END 而不仅仅是 div 的宽度?
我希望这一切都是有道理的。 谢谢。
您可以使用scrollWidth
和clientWidth
为scrollLeft
属性设置动画:
function animatethis(targetElement, speed) {
var scrollWidth = $(targetElement).get(0).scrollWidth;
var clientWidth = $(targetElement).get(0).clientWidth;
$(targetElement).animate({ scrollLeft: scrollWidth - clientWidth },
{
duration: speed,
complete: function () {
targetElement.animate({ scrollLeft: 0 },
{
duration: speed,
complete: function () {
animatethis(targetElement, speed);
}
});
}
});
};
animatethis($('#q1'), 5000);
结果可以在这个jsfiddle 中看到。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.