0

jQueryを使用してスライドショーカルーセルを作成し、マージン左の値からスライド幅を加算または減算することで前後に移動できるオーバーフローを非表示にしました。

http://trainingstage.ntistudio.co.uk/slideshows/2/presentation

http://pastebin.com/nYQiEfqB

スライドを関連するセクションに分類し、これらの各セクションの先頭に移動できるようにしたいと考えていますが、これを行う方法がわかりません. 主な問題は、コンテンツが動的 (レールで構築) になるため、各スライドショーに値をハードコーディングするオプションがないことです。

Rails バックエンドを形作ることができるように、jQuery のどこから始めるべきかについて、誰かが私にいくつかの指針を与えることができますか? 私が解体するための同様の作業プロジェクトもいいかもしれません。

この問題に関するヒントやヒントは大歓迎です。ありがとうございました

4

3 に答える 3

2
  • セクションの最初のページの要素に一意のIDを指定します。

  • jQueryを使用して、その要素のoffset（）を見つけます http://api.jquery.com/offset/

  • その要素が存在するスライドを計算します。大まかなアルゴリズム：current_slide = Math.ceil（$（'example'）。offset（）。left / slide_width）;

注：ショーの最初のスライドを1として初期化しているため、上記の操作の結果は常に切り上げる必要があります。

欠点：offset（）が実際にスライドショーの完全なドキュメントに基づいて要素を報告するのか、それとも単に個々のスライドに基づいて報告するのかはわかりません。

この解決策は厄介で、うまくいかないかもしれませんが、おそらくその中のアイデアはあなたに役立つでしょう。

于 2012-06-11T10:28:48.767 に答える
0

あなたのウェブサイトの目標を見た後、私はあなたの要件にぴったりのjQueryスライダーに出くわしました。

jQuery Local ScrollはAJAXコンテンツを簡単に処理し、メインセクション内のサブセクションを許可します。

jQuery AJAX Local Scroll v1.2.7： WebページAJAXデモとホームページはこちらです。

編集：スクローラーがページの読み込み時に動的に作成される場合は、セクションとサブセクションの異なるナビゲーション手法を示す通常の非AJAXバージョンを見てください。

EDIT2： jQueryを使用してさまざまな要素に移動したり、さまざまな要素から移動したりする限り、このプラグインはjQueryセレクターを使用して任意の要素にスクロールできます。

于 2012-06-12T02:13:08.303 に答える
0

各要素を識別子で分類します。たとえば、猫のカテゴリの場合、各項目に「猫」というクラスを追加します。猫の後に犬を飼っていて、犬に行きたいとしましょう。

var slideAmount = $('.cats').length * 500 //500 being your viewport width
$('.carouselParent').animate({'left' : -slideAmount});

これは非常に基本的なロジックです。

于 2012-06-11T20:10:46.860 に答える