0

リンクをクリックするとアニメーションが簡単に表示されるように、Web ページの下部までスクロールしたいと考えています。ホームページの下部に、wall という名前の div クラスを挿入しました。ホームページから「壁」をクリックすると、ページの一番下までスクロールする必要があります(divクラスの壁が同じホームページにあることに注意してください)。別のページにいるときは連絡先と言い、メニューの壁をクリックするとホームページをロードしてから下にスクロールする必要があります(ホームをクリックするとページが開き、スクロールしないことに注意してください)。そうする方法はありますか?私はhtml5でウェブサイトをデザインし、以下を使用しました

    <script type="text/javascript">

     function pageScroll() {
            window.scrollBy(0,50); // horizontal and vertical scroll increments
            scrolldelay = setTimeout('pageScroll()',20); 
// scrolls every 20 milliseconds
    }

      </script>
    <body onload="pageScroll()">

しかし問題は、ページが下にスクロールし、スクロールが止まらないことです。

jquery のスペルがほとんどわからない...助けが必要です。

4

2 に答える 2

3

それは次のように簡単です

$('html, body').animate({ 
    scrollTop: $(document).height()-$(window).height()
});

特定の Id にスクロールするには、次を使用します。

$("html, body").animate({ 
    scrollTop: $("#theID").scrollTop() 
}, 1000);
于 2012-12-20T13:14:26.653 に答える
1

文字通り、Google で「jquery を使用したスクロール」を検索した後の最初の結果は、「 JQuery を使用した垂直方向または水平方向のページのスムーズなスクロール」でした。そのページの内容を調べて、質問する前に調査を行うことを忘れないでください。


そのページの垂直スクロールの例と、すべての作業を行う JavaScript コードを次に示します。

$(function() {
    $('ul.nav a').bind('click',function(event){
        var $anchor = $(this);

        $('html, body').stop().animate({
            scrollTop: $($anchor.attr('href')).offset().top
        }, 1500,'easeInOutExpo');
        /*
        if you don't want to use the easing effects:
        $('html, body').stop().animate({
            scrollTop: $($anchor.attr('href')).offset().top
        }, 1000);
        */
        event.preventDefault();
    });
});

JQuery を初めて使用し、どこから始めればよいかわからない場合は、チュートリアル ページから始めて基本を学ぶことをお勧めします。また、目立たない javascriptを使用することをお勧めします。そうしないと、HTML に JavaScript 関数呼び出しが混在して混乱する可能性があります。

また、知っているかどうかはわかりませんが、javascript ファイルを html にリンクする場合は、head または body でこれを行います。

<script type="text/javascript" src="external_javascript.js"></script>

ハッピーコーディング!

于 2012-12-20T13:19:42.033 に答える