1

我目前正在使用 SmoothDivScroll 来实现滚动的图像流。但是,左侧热点速度过快,而右侧热点似乎没有正确响应。

我设置了一个展示问题的小提琴:http: //jsfiddle.net/gUewB/4/

我猜这与计算偏移量的方式有关,但我找不到解决问题的好方法。我的 JavaSkills 并不是那么好。:/

4

2 回答 2

3

我知道这个线程有点旧。但我有完全相同的问题!即使我更新到最新版本(这是发布版本 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”;

我希望这对任何人都有帮助。

于 2013-09-18T13:02:53.637 回答
1

发生错误的原因如下: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);
于 2012-07-17T12:18:57.217 回答