7款風(fēng)格新穎的jQuery/CSS3菜單導(dǎo)航分享
一款優(yōu)秀的菜單對(duì)網(wǎng)站而言是非常重要的，它不僅可以讓用戶方便地找到想要的信息，而且更讓人有一種特殊的用戶體驗(yàn)。下面給大家分享7款風(fēng)格新穎的jQuery/CSS3菜單導(dǎo)航，希望大家會(huì)喜歡。
1、CSS3立體飄帶狀菜單
CSS3立體飄帶狀菜單，該菜單鼠標(biāo)滑過(guò)時(shí)，菜單項(xiàng)向上立體凸起，結(jié)合黑色的木質(zhì)背景，整個(gè)菜單顯得非常立體生動(dòng)。
2、CSS3個(gè)人資料導(dǎo)航菜單
該菜單是用來(lái)展示登錄的用戶信息，包括用戶的快捷操作按鈕，另外菜單還提供一個(gè)個(gè)性化的搜索框。
3、jQuery頂部浮動(dòng)漸變工具欄
jQuery頂部浮動(dòng)漸變工具欄是一款基于jQuery的頂部導(dǎo)航插件，默認(rèn)該菜單不顯示，當(dāng)頁(yè)面向下滾動(dòng)時(shí)，該頂部菜單就會(huì)逐漸顯示出來(lái)，頁(yè)面滾動(dòng)到一定距離時(shí)，菜單會(huì)全部顯示。頁(yè)面距離由JS自動(dòng)判斷。
4、CSS3彩色多功能下拉菜單導(dǎo)航
這是一款強(qiáng)大的菜單導(dǎo)航，菜單集成了搜索、普通下拉菜單、帶圖標(biāo)的下拉菜單這些功能，而且色彩很豐富，是一款非常實(shí)用的網(wǎng)頁(yè)菜單導(dǎo)航。
5、灰色超具立體感的CSS3導(dǎo)航按鈕
這款菜單導(dǎo)航提供了水平和垂直兩種菜單模式，鼠標(biāo)滑過(guò)菜單項(xiàng)時(shí)非常具有立體感，很棒的一個(gè)網(wǎng)頁(yè)素材。
6、CSS3黑色動(dòng)畫(huà)菜單導(dǎo)航
這款菜單以黑色為背景，背景中又有氣泡作為點(diǎn)綴。菜單項(xiàng)以白色為主，鼠標(biāo)滑過(guò)菜單項(xiàng)出現(xiàn)動(dòng)畫(huà)效果，非?？岬囊豢頒SS3菜單。
7、帶小圖標(biāo)的jQuery多級(jí)菜單導(dǎo)航
這款菜單不僅是多級(jí)菜單，而且每一個(gè)菜單項(xiàng)都可以設(shè)置菜單的功能圖標(biāo)，因此非常實(shí)用。
以上就是7款風(fēng)格新穎的jQuery/CSS3菜單導(dǎo)航，部分特效示例由腳本之家提供，歡迎收藏。
- CSS3 media queries結(jié)合jQuery實(shí)現(xiàn)響應(yīng)式導(dǎo)航
- jQuery+CSS3實(shí)現(xiàn)仿花瓣網(wǎng)固定頂部位置帶懸浮效果的導(dǎo)航菜單
- 各式各樣的導(dǎo)航條效果css3結(jié)合jquery代碼實(shí)現(xiàn)
- jQuery+CSS3實(shí)現(xiàn)四種應(yīng)用廣泛的導(dǎo)航條制作實(shí)例詳解
- 使用jquery+CSS3實(shí)現(xiàn)仿windows10開(kāi)始菜單的下拉導(dǎo)航菜單特效
- jquery和css3實(shí)現(xiàn)的炫酷時(shí)尚的菜單導(dǎo)航
- jquery+css3實(shí)現(xiàn)熊貓tv導(dǎo)航代碼分享
相關(guān)文章
BootStrap中按鈕點(diǎn)擊后被禁用按鈕的最佳實(shí)現(xiàn)方法
在項(xiàng)目開(kāi)發(fā)中經(jīng)常會(huì)遇到這樣的功能，為了防止在Bootstrap中點(diǎn)擊按鈕多次提交，所以希望點(diǎn)擊按鈕后禁用按鈕。怎么實(shí)現(xiàn)此功能呢？今天腳本之家小編給大家分享BootStrap中按鈕點(diǎn)擊后被禁用按鈕的最佳實(shí)現(xiàn)方法，非常不錯(cuò)，感興趣的朋友參考下吧2016-09-09
編寫(xiě)高效jQuery代碼的4個(gè)原則和5個(gè)技巧
有了JQuery對(duì)JS的整合和封裝，它讓頁(yè)面操作更加的隨心所欲，所以只有遵循良好的規(guī)范才會(huì)讓代碼更高效，更健壯。以下是我對(duì)如何高效操作JQuery的一些拙見(jiàn)，望指正！2014-04-04
jquery 圖片Silhouette Fadeins漸顯效果
經(jīng)常漂流在css-tricks看到這篇文章，就順便搬了過(guò)來(lái)，下面譯文都是用css-tricks口吻來(lái)描述的。2010-02-02
jQuery插件簡(jiǎn)單學(xué)習(xí)實(shí)例教程
這篇文章主要介紹了jQuery插件的簡(jiǎn)單用法,列舉了分頁(yè)插件、放大鏡插件、自動(dòng)完成插件、上傳插件、日歷插件等的簡(jiǎn)單使用方法,需要的朋友可以參考下2016-07-07
好久不用jquery,了，有的函數(shù)都忘記了,這里看下jquery下如何查找元素的。2010-07-07
jQuery簡(jiǎn)單實(shí)現(xiàn)頁(yè)面元素置頂時(shí)懸浮效果示例
這篇文章主要介紹了jQuery簡(jiǎn)單實(shí)現(xiàn)頁(yè)面元素置頂時(shí)懸浮效果的方法,涉及jQuery針對(duì)頁(yè)面元素樣式的動(dòng)態(tài)操作技巧,需要的朋友可以參考下2016-08-08
jQuery實(shí)現(xiàn)獲取選中復(fù)選框的值實(shí)例詳解
這篇文章主要介紹了jQuery實(shí)現(xiàn)獲取選中復(fù)選框的值，非常不錯(cuò)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2018-06-06
jQuery中的bind綁定事件與文本框改變事件的臨時(shí)解決方法
暫時(shí)沒(méi)有想到什么好的解決辦法，我現(xiàn)在加了個(gè)瀏覽器判斷非ie的話就注冊(cè)blur事件，這樣有個(gè)問(wèn)題就是blur實(shí)在別的控件活動(dòng)焦點(diǎn)的時(shí)候，txtStation控件注冊(cè)的方法是為了填充它緊挨著的一個(gè)下拉列表2010-08-08
jquery 選擇器，jquery學(xué)習(xí)與開(kāi)發(fā)中需要用的到，大家可以收藏下，另外可以看下本站提供的學(xué)習(xí)jquery的資料。2009-10-10
jquery左邊浮動(dòng)到一定位置時(shí)顯示返回頂部按鈕
這篇文章主要介紹通過(guò)jquery實(shí)現(xiàn)左邊浮動(dòng)到一定位置時(shí)顯示返回頂部按鈕的效果,需要的朋友可以參考下2014-06-06