当前位置: 懒人建站 > JS代码 > 导航菜单 >

Jquery四种苹果风格导航菜单(横向/竖向/向上/向下

一个基于jquery的苹果风格导航菜单,共有四种展示形式,横向的、竖向的、点击向上弹出的、点击向下弹出的。div结构。 非常酷的效果,看应提示即知。
分享到:

代码说明:

一个基于jquery的苹果风格导航菜单,共有四种展示形式,横向的、竖向的、点击向上弹出的、点击向下弹出的。DIV结构。

非常酷的效果,看应提示即知。
部分代码如下:(你可以不看下面的代码^_^)

  <div id="dock">
   <div class="dock-container">
    <a class="dock-item" href="index.html"><span>Example&nbsp;1</span><img src="images/dock/home.png" alt="home" /></a>
    <a class="dock-item" href="example2.html"><span>Example&nbsp;2</span><img src="images/dock/email.png" alt="contact" /></a>
    <a class="dock-item" href="example3.html"><span>Example&nbsp;3</span><img src="images/dock/portfolio.png" alt="portfolio" /></a>
    <a class="dock-item" href="all-examples.html"><span>All&nbsp;Examples</span><img src="images/dock/music.png" alt="music" /></a>
    <a class="dock-item" href="#"><span>Video</span><img src="images/dock/video.png" alt="video" /></a>
    <a class="dock-item" href="#"><span>History</span><img src="images/dock/history.png" alt="history" /></a>
    <a class="dock-item" href="#"><span>Calendar</span><img src="images/dock/calendar.png" alt="calendar" /></a>
    <a class="dock-item" href="#"><span>Links</span><img src="images/dock/link.png" alt="links" /></a>
    <a class="dock-item" href="#"><span>RSS</span><img src="images/dock/rss.png" alt="rss" /></a>
    <a class="dock-item" href="#"><span>RSS2</span><img src="images/dock/rss2.png" alt="rss" /></a>
   </div><!-- end div .dock-container -->
  </div><!-- end div .dock #dock -->

来源:懒人建站|发布人:懒人建站|2009-12-07|热度:|收 藏|报 错


相关代码

懒人建站

登 录| 注 册
你也许会喜欢X 关闭↑返回顶部→相关代码/文章
收藏到: 百度搜藏 新浪微博 QQ空间 更多
香港免备案空间,一年80元,500M空间、免费送100M mysql数据库。香港新世界电讯机房,与万网香港空间同机房,懒人建站同服务器。点击这里给我发消息速度演示:jquery 特效