菜单指针通过滚动动画

我做了一个顶级菜单与underneith按钮一个小箭头。我想让这个箭头移动到我的单页设计中的滚动位置。菜单指针通过滚动动画

我认为我的基础工作......但不知何故，只要我尝试使箭头动起来（而不是让它在按钮之间跳转），它就会保持flippin的状态。我想这与多个> =有关......但我想不出替代方案。任何人都可以请给我一些建议吗？

的影响可以在这里看到：http://www.lightwavedesign.nl/

我现在用的是JS如下：

function goToByScroll(id){ 
     $('html,body').animate({scrollTop: $("#"+id).offset().top-78},'1000'); 
    }; 

    window.onload = function() { 
     var link1 = $("#Welkom"); var positionLink1 = link1.position(); 
     var link2 = $("#OverMij"); var positionLink2 = link2.position(); 
     var link3 = $("#Portfolio"); var positionLink3 = link3.position(); 
     var link4 = $("#Contact"); var positionLink4 = link4.position(); 

     function getScrollTop() { 
     if (typeof window.pageYOffset !== 'undefined') {return window.pageYOffset;} 
     var d = document.documentElement; 
     if (d.clientHeight) {return d.scrollTop;} 
     return document.body.scrollTop; 
     } 

     window.onscroll = function() { 
     var box = document.getElementById('menuAanwijzer'), 
     scroll = getScrollTop(); 
     if (scroll <= positionLink2.top) {$('#menuAanwijzer').animate({left: '665px'}, 100)} 
     if (scroll >= positionLink2.top-80) {$('#menuAanwijzer').animate({left: '760px'}, 100)} 
     if (scroll >= positionLink3.top-80) {$('#menuAanwijzer').animate({left: '860px'}, 100)} 
     if (scroll >= positionLink4.top-80) {$('#menuAanwijzer').animate({left: '960px'}, 100)} 
     if (scroll >= positionLink2.top-80) {$('#menuTitel').fadeIn('500');} 
     if (scroll <= positionLink2.top-80) {$('#menuTitel').fadeOut('500');} 

     }; 
    };

来源

2012-11-29 PowerGuitarist

使用'.stop（）。animate（' –

@roXon以何种方式..？ – PowerGuitarist

简单，明确使用.stop()
.stop（）动画队列动画（）

if (scroll <= positionLink2.top) {$('#menuAanwijzer').stop().animate({left: '665px'}, 100)} 
    if (scroll >= positionLink2.top-80) {$('#menuAanwijzer').stop().animate({left: '760px'}, 100)} 
    if (scroll >= positionLink3.top-80) {$('#menuAanwijzer').stop().animate({left: '860px'}, 100)} 
    if (scroll >= positionLink4.top-80) {$('#menuAanwijzer').stop().animate({left: '960px'}, 100)} 
    if (scroll >= positionLink2.top-80) {$('#menuTitel').stop().fadeIn('500');} 
    if (scroll <= positionLink2.top-80) {$('#menuTitel').stop().fadeOut('500');}

来源

2012-11-29 16:02:52

THX！works :)我真的没有k现在！ :) – PowerGuitarist

@PowerGuitarist不用客气！ :) –

菜单指针通过滚动动画

回答

相关问题