平滑滚动卡住了

时间:2013-11-24 21:52:46

标签: javascript jquery html css

我使用了一个jquery脚本让我的页面在锚点之间平滑滚动,并将“active”设置为菜单。

滚动卡住,滚动不顺畅。

现在还有其他人关于这个问题吗?

我的页面是:http://miriwein.com/

我的平滑滚动脚本:

// Cache selectors
var lastId,
topMenu = $(".anc"),
topMenuHeight = topMenu.outerHeight()-150,
 // All list items
 menuItems = topMenu.find("a"),
 // Anchors corresponding to menu items
 scrollItems = menuItems.map(function(){
    var item = $($(this).attr("href"));
    if (item.length) { return item; }
 });

 // Bind click handler to menu items
 // so we can get a fancy scroll animation
 menuItems.click(function(e){
    var href = $(this).attr("href"),
    offsetTop = href === "#" ? 0 : $(href).offset().top-topMenuHeight+1;
    $('html, body').stop().animate({ 
        scrollTop: offsetTop
    }, 2000);
    e.preventDefault();
 });

 // Bind to scroll
 $(window).scroll(function(){
 // Get container scroll position
 var fromTop = $(this).scrollTop()+topMenuHeight;

 // Get id of current scroll item
 var cur = scrollItems.map(function(){
    if ($(this).offset().top < fromTop)
        return this;
 });
 // Get the id of the current element
 cur = cur[cur.length-1];
 var id = cur && cur.length ? cur[0].id : "";

 if (lastId !== id) {
    lastId = id;
 // Set/remove active class
 menuItems
 .parent().removeClass("active")
 .end().filter("[href=#"+id+"]").parent().addClass("active");
}                   
});

0 个答案:

没有答案