1

スクロールとアウターダイブとインナーダイブを備えたメイン div があります。ボタンをクリックすると、メイン div が次の内部 div の先頭にスクロールするようにしたいと思います

http://jsfiddle.net/alamin84/63FY7/2/

最初のクリックで div 11 にスクロールし、次に 12、13、次に 21 にスクロールします。これは次のサブ div にあるなどです。

この質問の2番目のコメントを利用しようとしました

Rob W によるスクロール可能な div の最初と最後の可視要素を取得し ますが、最初の可視要素への参照を保持する必要がある変数 $first は、console.logged のときに undefined になります。問題は、何が間違っているのですか？これを正しく行う方法は？

前もって感謝します

****編集****

devundef の提案を適用した後も、スクロールの正しいシーケンスを取得できません

現在は 12 -22 -32 です

11 - 12 -13 -21-22…など

別の言い方をすると、最初に表示される内部 div (class="sub2") を取得する方法で、これを使用して次の表示される内部 div を取得/スクロールできます。

新しいフィドル

http://jsfiddle.net/alamin84/63FY7/15/

4

3 に答える 3

1

この行は決して評価されませんtrue:

if ($first && position.top >= positions.top) ...

この時点で $first が null であるためです。あなたは尋ねなければなりません!$first

if (!$first && position.top >= positions.top) ...

フィドル: http://jsfiddle.net/63FY7/3/

ところで、jquery.scrollTo プラグインをお勧めします。非常にうまく機能します。

デモ: http://demos.flesler.com/jquery/scrollTo/

スニペット: http://jsfiddle.net/wuN65/1/

于 2012-08-05T12:05:36.963 に答える
0

最初に表示される内部 div (class="sub2") を取得する方法は?
外側の div には外側のセレクターを、内側の div には内側のセレクターを用意する必要はありませんでした。内側の div には 1 つのセレクターだけで十分です。

コード：

                 $("#btnScroll").click(function (event) {

                     var $firstinner, $lastinner, $containerinner = $("#dvmn"),
                         positions = $containerinner.offset(),
                         positionsinner = $containerinner.offset();


                     $('.sub2').each(function (i, obj) {
                         var $thisinner = $(this),
                             positioninner = $thisinner.offset();


                         if (!$firstinner && positioninner.top >= positions.top) {

                             $firstinner = $thisinner.next();
                             if ($firstinner.length == 0) {
                //When last inner div get to next outer div
                                 $firstinner = $thisinner.parent().next();

                             }

                             console.log($firstinner);
                         }

                     });

                     $containerinner.scrollTo($($firstinner), {
                         duration: 500
                     });

                 });

フィドル: http://jsfiddle.net/alamin84/63FY7/24/

そしてもちろん、devundef のおかげで jquery.scrollTo プラグインを使用

于 2012-08-14T00:29:32.107 に答える
-1

非常に大雑把で昔ながらの方法は、scrollIntoView()メソッドを使用することです。

だから、次elementが何であるかを知っているなら、あなたはただすることができます..

element.scrollIntoView()

詳細はこちらをご覧ください。

于 2012-08-05T20:12:08.753 に答える