2014-10-22 2 views
0

У меня есть 2 меню в моей сети, которые содержат: menu1 menu2 content footer.изменить положение элемента, когда он прокручивается из экрана

, когда я прокрутка вверх, я хочу, чтобы menu2 останется, но будет находиться в верхней части (вместо menu1) поэтому после свитка: menu2 содержания FOOTER

благодаря

+1

Какова ваша разметка? И что еще более важно, что вы придумали? – laruiss

+0

где код для скрипки: D – Alexandros

ответ

2

Просто сделали небольшой jsfiddle с помощью JQuery , Должно быть легко понять.

HTML

<div id="menu1"> 
    Menu 1 
</div> 
<div id="menu2"> 
    Menu 2 
</div> 
<div id="content"> 
    Content 
</div> 
<div id="footer"> 
    Footer 
</div> 

Javascript

$(window).scroll(function() {  
    if($(window).scrollTop() >= $("#menu1").height() && $("#menu2").css("position") != "fixed"){ 
     $("#menu2").css("position", "fixed"); 
     $("#menu2").css("top", "0"); 
     $("#content").css("margin-top", $("#menu2").height() + "px"); 
    } 
    else if($(window).scrollTop() < $("#menu1").height() && $("#menu2").css("position") == "fixed") 
    { 
     $("#menu2").css("position", ""); 
     $("#menu2").css("top", ""); 
     $("#content").css("margin-top", ""); 
    } 
}); 

http://jsfiddle.net/oaa1e6y2/3/

Не стесняйтесь спросить, если у вас есть какие-либо вопросы к этому.

Смежные вопросы