Div滚动向下滚动窗口

时间:2013-05-05 03:20:01

标签: jquery

我需要将我网站的正确div菜单向下滚动,以便用jquery的用户眼睛卡住。

这是我的代码,但是

    jQuery("body").scroll(function(){
jQuery("#scroll").animate({
               marginTop: jQuery(window).offset()}, 1500 );
            });

您可以从以下链接查看右侧菜单 http://gridberry.com/clients/tlgcenter/node/87

2 个答案:

答案 0 :(得分:2)

HTML

<div id="follow">
    <p>This element will follow all the way down to page</p>
    <p></p>
</div>

的jQuery

$(document).ready(function () {
    var speed = 1000;
    var current_top = parseInt($('#follow').css('top'));
    $(window).scroll(function () {
        var top = $(window).scrollTop();
        $('#follow').css('top', top + current_top);
    });
});

CSS

#follow {
    position:absolute;
    left:10px;
    top:10px;
    height:50px;
    width:100%;
    background-color:#f0f0f0;
    border:1px solid #404040;
    padding:8px;
}

工作演示http://jsfiddle.net/cse_tushar/YpHxd/

答案 1 :(得分:1)

这会帮助你解决它的问题......

修改

一个升级版本,它调用动画函数来消除IE中的不连贯行为。

function animateMenu(pos) {
    $("#sticky").stop(true, false).animate({
        marginTop: pos
    }, 500);
}

var offset = $("#sticky").offset().top;
$(window).scroll(function () {
    console.log($(window).scrollTop());
    if ($(window).scrollTop() > offset) {
        animateMenu($(window).scrollTop());
    }
})

之前的小提琴:http://jsfiddle.net/djwave28/eFCpc/1/

新小提琴:http://jsfiddle.net/djwave28/eFCpc/2/