2011-05-19 39 views
0

我正在嘗試創建一個動畫滑動導航菜單,其中子菜單使用左側屬性的動畫切換滑出。在不添加顯示的情況下切換左側動畫:無

我已經成功地設法讓左邊的屬性在-360px的初始設置之間切換,div的隱藏位置和0屬性被擴展出來,但是當左邊屬性切換爲0時,它也會添加顯示:無。

我覺得應該有一個相當簡單的解決方案,但至今我一直沒能找到它

這裏是它的實現

頁面,這裏是jQuery函數:

http://alexpeake.info/index

$(document).ready(function(){ 
    $("#gallerytoggle").click(function(){ 
    $("#travelling_info").animate({left:'toggle'},"slow"); 
    }); 

}) 
+1

你還可以描述爲什麼你不想使用* display:none; *? – quasistoic 2011-05-19 16:25:10

+0

另外,雙擊箭頭。它搞砸了你的佈局。我會考慮解決這個問題。 – Blender 2011-05-19 16:28:12

+0

我不想顯示none,因爲我想要的功能是div滑出來顯示一個子菜單,然後再次滑動時,不會滑出和消失。 – 2011-05-19 16:55:31

回答

2

你可以做手工。不知道它是否是最佳的,但它是我做這件事的天真的方式:

var state = 1; 

$(document).ready(function(){ 
    $("#gallerytoggle").click(function(){ 
    $("#travelling_info").animate({left: parseInt((state % 2 - 1) * (-360)) + 'px'}, "slow"); 
    state++; 
    });  
}); 
+0

當我嘗試這個div進一步向左移動,只是在這個第三個位置和第二個之間交替,而不是在原來的和第二個 – 2011-05-19 16:53:53

+0

之間修改一下你的代碼的小改動,謝謝 -360應該是360 – 2011-05-19 18:45:14

相關問題