在有機標籤上添加和編輯標籤

我目前正在嘗試使用有機標籤（http://css-tricks.com/organic-tabs/）創建一個時間表，但在更改標籤名稱和添加標籤時遇到困難。下面是我在CSS已經改變：在有機標籤上添加和編輯標籤

#example-one li.nav-one a.current, ul.Monday li a:hover { background-color: #0575f4; color: white; } 
#example-one li.nav-two a.current, ul.Tuesday li a:hover { background-color: #d30000; color: white; } 
#example-one li.nav-three a.current, ul.jquerytuts li a:hover { background-color: #8d01b0; color: white; } 
#example-one li.nav-four a.current, ul.thursday li a:hover { background-color: #FE4902; color: white; } 
#example-one li.nav-five a.current, ul.friday li a:hover { background-color: #33CC33; color: white; } 
#example-one li.nav-six a.current, ul.saturday li a:hover { background-color: #FF19FF; color: white; } 
#example-one li.nav-seven a.current, ul.sunday li a:hover { background-color: #FFFF00; color: white; }

這裏就是我在HTML已經改變：

 <div id="example-one"> 

<ul class="nav"> 
      <li class="nav-one"><a href="#Monday" class="current">Monday</a></li> 
      <li class="nav-one"><a href="#Tuesday">Tuesday</a></li> 
      <li class="nav-one"><a href="#Wednesday">Wednesday</a></li> 
      <li class="nav-one"><a href="#classics">Thursday</a></li> 
      <li class="nav-one"><a href="#jquerytuts">Friday</a></li> 
      <li class="nav-one"><a href="#jquerytuts">Saturday</a></li> 
      <li class="nav-one last"><a href="#jquerytuts">Sunday</a></li> 
</ul> 

<div class="list-wrap"> 

    <ul id="Monday"> 
     <li><a href="#test">Some Stuff</a></li> 
    </ul> 

</div> <!-- END List Wrap -->

的Java是不變如此相同網站上提供。如果我不將它們改爲「星期一」，那麼它就會起作用，但如果我改變它們，就像我想要的那樣，懸停就起作用，只是不會更改爲不同的列表。

任何想法？我想這可能是Javascript，因爲我不知道如何正確使用Javascript ...

來源

2013-03-08 user2132985

在代碼中搜索「星期一」之前的任何內容，並將其更改爲星期一？ – Barney 2013-03-08 17:35:35

我試過了，「精選」已被替換爲一切，但仍然無效。 – user2132985 2013-03-08 18:12:05

Here一個關於jsfiddle的例子，你的css在底部。

我已經改變標籤名稱（第一）和添加標籤（最後）。

<div id="example-one"> 

     <ul class="nav"> 
      <li class="nav-one"><a href="#featured" class="current">Rename Featured</a></li> <!-- rename --> 
      <li class="nav-two"><a href="#core">Core</a></li> 
      <li class="nav-three"><a href="#jquerytuts">jQuery</a></li> 
      <li class="nav-four "><a href="#classics">Classics</a></li> 
      <li class="nav-five last"><a href="#jquerytuts">Adding tab</a></li><!-- add --> 
     </ul> 
     [...]

這是你想要的嗎？

來源

2013-07-14 20:12:43

在有機標籤上添加和編輯標籤

回答

相關問題