Question

大家好，

我刚接触php。我想向下滚动到我的div点击按钮。请帮我，我是怎么做的。当我点击按钮时，滚动会稍微移动到我的div。

我使用此代码

  <script type="text/javascript">
    $(document).ready(function() {
    $('#scroll').click(function() {
    $.scrollTo($('#res'), 500);
    })
  });
 </script>


<input type="button" value="Scroll" id="scroll" />

<div id="data">one big idea.
<div class="res" id="res">
<h2>RESULT</h2>
one big idea..
</div>
<p>one big idea.</p>
</div>

提前致谢

Answer 1

$('#scroll').click(function() {
  $('html,body').animate({'scrollTop':$('#res').position().top}, 500);
});

Answer 2

$(".jumper").on("click", function( e ) {

    e.preventDefault();

    $("body").animate({ 
        scrollTop: $( $(this).attr('href') ).offset().top 
    }, 600);

});

LABEL的

DEMO WORKING ..

Answer 3

我用这个......

//  [a] obj to scroll to, mandatory, like, '#id' or '.class'
//  [c] miliseconds, default 1 sec. if not set
//  [b] offset from top, default 0 if not set
function sTo(a,c,b){
    if(typeof(a)=="undefined")return;
    c=typeof(c)!="undefined"?c:1000;
    b=typeof(b)!="undefined"?b:0;
    jQuery("html,body").stop(true,true).animate({scrollTop:jQuery(a).offset().top+b},c,function(){
        // if you want a callback function, call it here
    });
}

然后，只需将其称为：

<input type="button" value="Scroll" id="scroll" onclick="sTo('#res',500,50)"/>

Answer 4

ScrollTo不是现有的jquery函数。

您可以使用ScrollTop click和Animate click的组合来模拟它。像这样：

 $(document).ready(function() {
    $("#scroll").click(function() {
      $('html, body').animate({
        scrollTop: $("#res").offset().top
      }, 2000);
   });
 });

http://jsfiddle.net/QW5WJ/

点击按钮滚动到特定div？

4 个答案: