我目前正在使用 SmoothDivScroll 来实现滚动的图像流。但是,左侧热点速度过快,而右侧热点似乎没有正确响应。
我设置了一个展示问题的小提琴:http: //jsfiddle.net/gUewB/4/
我猜这与计算偏移量的方式有关,但我找不到解决问题的好方法。我的 JavaSkills 并不是那么好。:/
我目前正在使用 SmoothDivScroll 来实现滚动的图像流。但是,左侧热点速度过快,而右侧热点似乎没有正确响应。
我设置了一个展示问题的小提琴:http: //jsfiddle.net/gUewB/4/
我猜这与计算偏移量的方式有关,但我找不到解决问题的好方法。我的 JavaSkills 并不是那么好。:/
我知道这个线程有点旧。但我有完全相同的问题!即使我更新到最新版本(这是发布版本 1.3 的时刻)
不幸的是,Pieter Mathys 的解决方案对我不起作用。
我发现如果所有共同图像的宽度小于scrollableArea-div,就会出现滚动问题。所以你所要做的就是检查是否有足够的图像来填充可滚动区域。如果没有,则无论如何您都不需要 SmoothDivScroll。我有一些示例代码:
... html is already in in DOM ...
imagesLoaded( '#myScrollable', function( element )
{
var $myScrollable = $(element.elements); // just one #myScrollable
var imgWidths = 0;
var images = $myScrollable.find('img');
for(var loop=0; loop < images.length; loop++)
imgWidths += $(images[loop]).width();
if( imgWidths > $myScrollable.width() )
{
$myScrollable.smoothDivScroll(
{
manualContinuousScrolling: true
});
$myScrollable.smoothDivScroll("recalculateScrollableArea");
}
});
但我不得不说,我使用了来自https://github.com/desandro/imagesloaded的插件(imagesLoaded),以便在加载所有图像时发生事件。否则所有图像的大小为“0”;
我希望这对任何人都有帮助。
发生错误的原因如下:margin: 0 auto;
用以下方法修复它:
设置向右滚动的事件:
var x = e.pageX - (this.offsetLeft + el.data("scrollerOffset").left);
变成
var x = el.data("hotSpotWidth") + (e.pageX - el.data("scrollerOffset").left - 960);
设置向左滚动的事件:
var x = ((this.offsetLeft + el.data("scrollerOffset").left + el.data("hotSpotWidth")) - e.pageX);
变成
var x = el.data("hotSpotWidth") - (e.pageX - el.data("scrollerOffset").left);