单击按钮后如何自动滚动到div?

时间:2011-02-16 20:38:03

标签: javascript jquery

我在顶部有一个按钮,中间有4个表,页面底部有一个div(id =“MasterDiv”)。单击按钮后如何自动滚动到div? 感谢

4 个答案:

答案 0 :(得分:6)

您可以使用此功能(使用jQuery的.animate

function scrollToElement(selector, callback){
    var animation = {scrollTop: $(selector).offset().top};
    $('html,body').animate(animation, 'slow', 'swing', function() {
        if (typeof callback == 'function') {
            callback();
        }
        callback = null;
    });
}

你这样称呼它:

scrollToElement('#MasterDiv');

或者,如果您想要包含回调:

scrollToElement('#MasterDiv', function(){
  alert('Page scrolled');
});

答案 1 :(得分:2)

Example
A named anchor inside an HTML document:

<a name="tips">Useful Tips Section</a>
Create a link to the "Useful Tips Section" inside the same document:

<a href="#tips">Visit the Useful Tips Section</a>
Or, create a link to the "Useful Tips Section" from another page:

<a href="http://www.w3schools.com/html_links.htm#tips">
Visit the Useful Tips Section</a>

source

答案 2 :(得分:1)

您可以尝试使用此库:http://demos.flesler.com/jquery/scrollTo/

答案 3 :(得分:0)

没有动画基本Javascript示例(使用ID而不是name属性)

window.location = "#MasterDiv";

More on window.location

Jquery动画示例

$.scrollTo("#MasterDiv");

ScrollTo Jquery Plugin