現在 SmoothDivScroll を使用して、画像のローリング ストリームを実装しています。ただし、左のホットスポットは速すぎますが、右のホットスポットは適切に応答していないようです。
問題を示すフィドルをセットアップしました:http://jsfiddle.net/gUewB/4/
これはオフセットの計算方法と関係があると思いますが、問題を解決するための適切な修正が見つかりません。私の JavaSkills はそれほど優れていません。:/
現在 SmoothDivScroll を使用して、画像のローリング ストリームを実装しています。ただし、左のホットスポットは速すぎますが、右のホットスポットは適切に応答していないようです。
問題を示すフィドルをセットアップしました:http://jsfiddle.net/gUewB/4/
これはオフセットの計算方法と関係があると思いますが、問題を解決するための適切な修正が見つかりません。私の JavaSkills はそれほど優れていません。:/
このスレッドが古いことは知っています。しかし、私はまったく同じ問題を抱えていました!私も最新バージョンに更新しました(バージョン1.3を投稿した時点です)
残念ながら、Pieter Mathys の解決策はうまくいきませんでした。
共通のすべての画像の幅が scrollableArea-div より小さい場合、スクロールの問題が発生することがわかりました。したがって、scrollableArea を埋めるのに十分な画像があるかどうかを確認するだけです。そうでない場合は、とにかく 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);