javascript - ページ上の div までスクロールする

Question

イベント時にページをスクロールしようとしています.click。これが私がこれまでに持っているものです：

jQuery:

function scrollToStart() {
    $("#scrollToStart").click(function() {
      $("#startHere").animate({ scrollTop: 0 }, "slow");
      return false;
    });
}

HTML:

<a href="#startHere" id="scrollToStart">
    <img class="img-center" src="images/get-started.png"/>
</a>

クリックしても何も起こりません。私は何を間違えましたか？

score 2 · Accepted Answer

これはうまくいくはずです

$("#scrollToStart").click(function (){
       $('html, body').animate({
       crollTop: $("#startHere").offset().top
     }, 2000);

});

実用的なフィドル http://jsfiddle.net/tvTUu/

score 1 · Accepted Answer

使用する

$('html,body').animate({    
 scrollTop: $("#divToBeScrolledTo").offset().top;    
});

scrollTop: 0常にページの一番上までスクロールします。

ここで見つけることができる詳細情報 (live-Demo を使用):
http://css-tricks.com/snippets/jquery/smooth-scrolling/

score 0 · Accepted Answer

$("#scrollToStart").bind('click',function() {

$('body , html').animate(
  {
    scrollTop :  $("#startHere").offset().top
  } , 2000 ) ;
});

http://justprogrammer.com/2013/06/21/scroll-to-specifically-element-in-browser/ http://justprogrammer.com/2013/06/25/jquery-basic-concepts/

score 0 · Accepted Answer

$(function(){// when dom loaded
    $("#scrollToStart").click(function (){
       $(document.body).animate({
          scrollTop: 0
       });
    });
});

私は私のために働いています。

score 0 · Accepted Answer

質問を正しく理解できた場合は、アニメーション効果を使用して、クリックイベントの一番上の位置までページをスクロールする必要があります。少し前に似たようなことをしました。これが JavaScript コードです。

innerAnimationStep = 25;
innerScrollStep = 1;

function scrollTopAnimated(scrollStep, animationStep)
{
    try
    {
        innerScrollStep = scrollStep;
        innerAnimationStep = animationStep;
        scrollTopAnimationStep();
    }
    catch(e)
    {
        console.log(e.message);
    }
}

function scrollTopAnimationStep()
{   
    try
    {
        var jDocument = $(document); 
        if(jDocument.scrollTop() > 0)
        {
            jDocument.scrollTop( jDocument.scrollTop() - innerScrollStep );
            setTimeout(scrollTopAnimationStep, innerAnimationStep);
        }
    }
    catch(e)
    {
        console.log(e.message);
    }
}

呼び出すだけscrollTopAnimatedで、アニメーション効果のあるページスクロールを取得できます。お役に立てば幸いです。

score -1 · Accepted Answer

$( document ).ready(function(){
$("#scrollToStart").click(function() {
  $("#startHere").animate({ scrollTop: 0 }, "slow");
  return false;
});});

javascript - ページ上の div までスクロールする

6 に答える 6

Related

Reference