Rails 3 - 動態菜單項

我在部分HTML菜單中，我想根據我們在哪個頁面使菜單項動態（更改顏色）。我怎樣才能做到這一點？Rails 3 - 動態菜單項

感謝

2010-11-26 donald

用來改變菜單的外觀，以反映當前頁面慣常的伎倆是把一個CSS選擇器或類反映在body標籤頁面名稱。

一旦你完成了，你可以爲你想要的每個頁面名稱變體創建不同的樣式。

例如：

<!-- @page_name is 'home' in this example --> 
<body class="<%= @page_name %>"> 

    <!-- Lots of html here --> 

    <div class="nav_links"> 
    <ul id="nav"> 
     <li class="home"><a href="/"><span>Home</span></a></li> 
     <li class="about_us"><a href="/about"><span>About us</span></a></li> 
     <li class="store"><a href="/store"><span>Shop</span></a></li> 
    </ul> 
    </div>

那麼CSS可以是任何你喜歡的，但這樣的：

body.home div.nav_links ul li.home { /* blah blah */ } 
body.about_us div.nav_links ul li.about_us { /* blah blah */ }

這種方法可以確保的擔憂分離效果好：視覺樣式（你的顏色的變化）留在你的樣式表中，並且不在你的代碼中。

來源

2010-11-26 22:14:33 Scott

創建幫助程序以生成菜單的html，並使用controller.controller_name變量來更改類。

來源

2010-11-26 22:15:26

我有同樣的問題，我創建輔助方法來設置活動的菜單項。

def active_tab(id) 
    if id == menu_entry_id 
     'active' 
    else 
     'tab' 
    end 
    end 

    def menu_entry_id 
    if controller_path.match('/') 
     controller_path.gsub!('/', '_') 
    else 
     controller_path 
    end 
    end

實施例菜單

%li{:class => "#{active_tab 'admin_dashboard'}"}= link_to 'Dashboard', admin_dashboard_path 
%li{:class => "#{active_tab 'admin_customers'}"}= link_to 'Customers', admin_customers_path

正如你可以在我通過預期的結果從controller路徑的active_tab見（/替換爲_）。 active_tab將它的輸入與controller_path的結果進行比較，並返回激活它或只是選項卡。

我想可能還有其他方法可以做到，但我無法想出更好的東西。

來源

2010-11-28 19:24:33

Rails 3 - 動態菜單項

回答

相關問題