jQueryプラグインSmoothDivScroll(http://www.smoothdivscroll.com/)は、含まれているコンテンツの中央から開始するようにしようとしているため、読み込み時に左右にスクロールバーがあります。私はstartAtElementIdオプションがあることを知っていますが、これは私が中心から始めることを許可しません。SmoothDivScrollをスクロールエリアの中央から開始するようにする
私は中心点を計算して適切な要素に適用しようとしましたが、左のスクロールは常に予想よりも前に停止し、右の要素は下に浮いています。これは運とJS使用してみました
:
$("div#scroller").smoothDivScroll();
var halfWayDoc = $(document).width()/2;
var halfWayScrollArea = $("#scroller .scrollableArea").width() /2;
var halfWay = halfWayDoc - halfWayScrollArea;
var scrollArea = $("#scroller .scrollableArea").width();
var scrollAreaAdjust = scrollArea + halfWay;
$("#scroller .item:first-child").css("margin-left",halfWay);
$("#scroller .item:last-child").css("margin-right",halfWay);
$("#scroller .scrollableArea").width(scrollAreaAdjust);
HTMLは次のようになります。
<div id="scroller">
<div class="scrollingHotSpotLeft"></div>
<div class="scrollingHotSpotRight"></div>
<div class="scrollWrapper">
<div class="scrollableArea">
<div class="item">
<img src="assets/images/detail/Erdem-A-W-11-B2-sml.jpg" alt="example"/>
</div>
...
<div class="item">
<img src="assets/images/detail/Erdem-A-W-11-B2-sml.jpg" alt="example"/>
</div>
</div>
</div>
</div>
すべてのヘルプやポインタが高く評価されています。
乾杯、 ショーン
JsFiddleを使って問題? – Qorbani
@ Qorbani私はここでフィドルを追加しました:http://jsfiddle.net/shaunmorrison/4JeSv/26/ - どのように最初のアイテムが負のマージンを持つかを知る(オフページ) 2番目の項目はウィンドウ境界を越えません。 また、余白があっても 'scrollableArea'幅のためアイテムが正しくシャントされません。 –