切換分區的邏輯

Question

我有一個問題。我一直在這個網站上工作了一段時間，而且我碰到了一堵磚牆。我已經想了很多次了，我不知道該怎麼做。

我對頁面上的內容有5種不同的配置，我需要在它們之間交換。應該發生的事情是，當用戶點擊一個按鈕時，應該會發生一系列動畫，並最終用被按下的按鈕替換按鈕和頂部。頂部的應該返回到原來的位置（「Home」應該始終位於頂部，「About」應該總是在其下方，除了當前頁面時）。

我的網站在這裏，http://www.logicanddesign.ca，所有的javascript都是開放給你看的。任何幫助你們可以提供真正的幫助。我想這樣做，而不是完全重寫我的網站，但如果這是唯一的方式，我會。

Answer 1

那麼，我想指出的第一件事是，您將button_click函數與圖像關聯，而不是包含它們的div。您最好使用div標籤進行事件處理。其次，你只移動當前按鈕和按下的按鈕。爲了達到您要做的效果，您需要移動默認位置buttonPressed和currentPage之間的按鈕。

此外，你不能靜態定義moveUp功能的按鈕按下，沒有別的。因爲有時您需要將按鈕和當前按鈕之間的按鈕向上移動。

作爲顯示器，當您將div設置爲動畫時，您需要考慮中間移動。可能在moveDivs函數中。

I made a fiddle representing what changes you could do to achive required effect, but I feel what I have written is a mess.排序混亂是值得的噩夢，真的...

在我看來，你可以創建一個JavaScript類來處理動畫和動作。創建一個類將使代碼更加清潔，並且您可以無限制地添加按鈕而不會破壞您的代碼。