我想用動畫創建以下內容。有一個我無法修復的問題。多個動作div向上移動

當我點擊紅色的div時，它就好了。但是當我滾動並點擊黃色div時，導航向上移動並離開。 .removeAttr（'style'）可能是一個解決方案嗎？

我建立了一個功能，所以當我滾動導航上移。

當我點擊紅色div下拉div然後向下滾動然後點擊黃色div並且導航DONT向上移開時，這有多可能。

這裏是我的小提琴：Fiddle

/* MAIN FUNCTION */ 

var $a = $(".a"), 
    $b = $(".b"), 
    $c = $(".c"); 

function anim1() { 
    $b.animate({width: 395}, {duration: 300, complete: anim2}); 
} 

function anim2() { 
    $a.animate({top:"0px"}, {duration: 400}); 
    $c.animate({top:"0px"}, {duration: 400}); 
} 

$(".b").click(function() { 
    anim1(); 
}); 

function anim10() { 
$c.animate({top:"-50px"}, {duration: 200}); 
$a.animate({top:"-50px"}, {duration: 200 , complete: anim20}); 
} 

function anim20() { 
$b.animate({width: 137}, {duration: 200}); 
} 

$(".ab").click(function() { 
anim10().removeAttr('style'); 
}); 

/* SLIDE UP ONLY MAIN NAVIGATION */ 

$(window).scroll(function() { 
    if ($(this).scrollTop() < 200) 
    { 
     $(".example").animate({top:"0px"},{duration: 50,easing: 'easeInOutCubic'}); 
    } 
    else 
    {  
     $(".example").animate({top:"-50px"},{duration: 50,easing: 'easeInOutCubic'}); 
    } 

    return false; 
});

來源

2014-01-16 user3191542

問題是這樣的：

$(".ab").click(function() { 
    anim10(); 
});

將其更改爲

$(".ab").click(function() { 
    if ($(window).scrollTop() == 0) { 
     anim10(); 
    } 
});

，因此會檢查用戶是否在頂部當您點擊黃色div之前，頁面關閉。

Demo

來源

2014-01-16 23:45:03 Cilan

嘿感謝您的答覆！ :)但那是錯的。看看這個頁面http://hellomonday.com/這是我想創建點擊項目和幻燈片，導航移動，然後點擊你好星期一......導航是在滾動後仍然存在！這是我想要創建的。 – user3191542

@ user3191542對不起，我不明白你的口音，請看我的更新回答 – Cilan

哦，我的上帝！謝謝sooooo多！ – user3191542

多個動作div向上移動

回答

Demo

相關問題