寻找标签导航菜单样式？

Question

我正在寻找一个标签导航菜单，该菜单可以为图片提供作为tabitems。 所以我有这样的事情：

<div class="menu"> 

      <a href="#"> 
        <img src="images/Chrysanthemum.jpg" style="width:10%; height:10%" title="Chrysanthemum" /> 
      </a> 
      <a href="#"> 
        <img src="images/Desert.jpg" style="width:10%; height:10%" title="Desert" /> 
      </a> 
      <a href="#"> 
        <img src="images/Hydrangeas.jpg" style="width:10%; height:10%" title="Hydrangeas"/> 
      </a> 
      <a href="#"> 
        <img src="images/Jellyfish.jpg" style="width:10%; height:10%" title="Jellyfish" /> 
      </a> 
      <a href="#"> 
        <img src="images/Penguins.jpg" style="width:10%; height:10%" title="Penguins" /> 
      </a> 


     </div> 

我已经尝试了一些jQuery的/ CSS的人，但我无法找到一个给了我一个很好的样式，包含图像的标签？

Answer 1

尝试使用jQuery UI选项卡。

结帐上http://jqueryui.com/demos/tabs/#default

的代码替换演示即导航项目，

<ul> 
    <li><a href="#tabs-1">Nunc tincidunt</a></li> 
    <li><a href="#tabs-2">Proin dolor</a></li> 
    <li><a href="#tabs-3">Aenean lacinia</a></li> 
</ul> 

与你的内容，就像...

<ul> 
    <li> 
    <a href="#"><img src="images/Chrysanthemum.jpg" style="width:10%; height:10%" title="Chrysanthemum" /></a> 
    </li> 
    <li> 
    <a href="#"><img src="images/Desert.jpg" style="width:10%; height:10%" title="Desert" /></a> 
    </li> 
    <li> 
    <a href="#"><img src="images/Hydrangeas.jpg" style="width:10%; height:10%" title="Hydrangeas"/></a> 
    </li> 
    <li> 
    <a href="#"><img src="images/Jellyfish.jpg" style="width:10%; height:10%" title="Jellyfish" /></a> 
    </li> 
    <li> 
    <a href="#"><img src="images/Penguins.jpg" style="width:10%; height:10%" title="Penguins" /></a> 
    </li> 
</ul> 

图像的大小应适合你的标签。

希望你能理解... :)