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)滑過時(shí)，菜單項(xiàng)向上立體凸起，結(jié)合黑色的木質(zhì)背景，整個(gè)菜單顯得非常立體生動(dòng)。
2、CSS3個(gè)人資料導(dǎo)航菜單
該菜單是用來展示登錄的用戶信息，包括用戶的快捷操作按鈕，另外菜單還提供一個(gè)個(gè)性化的搜索框。
3、jQuery頂部浮動(dòng)漸變工具欄
jQuery頂部浮動(dòng)漸變工具欄是一款基于jQuery的頂部導(dǎo)航插件，默認(rèn)該菜單不顯示，當(dāng)頁(yè)面向下滾動(dòng)時(shí)，該頂部菜單就會(huì)逐漸顯示出來，頁(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)滑過菜單項(xiàng)時(shí)非常具有立體感，很棒的一個(gè)網(wǎng)頁(yè)素材。
6、CSS3黑色動(dòng)畫菜單導(dǎo)航
這款菜單以黑色為背景，背景中又有氣泡作為點(diǎn)綴。菜單項(xiàng)以白色為主，鼠標(biāo)滑過菜單項(xiàng)出現(xiàn)動(dòng)畫效果，非常酷的一款CSS3菜單。
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開始菜單的下拉導(dǎo)航菜單特效
- jquery和css3實(shí)現(xiàn)的炫酷時(shí)尚的菜單導(dǎo)航
- jquery+css3實(shí)現(xiàn)熊貓tv導(dǎo)航代碼分享
相關(guān)文章
jQuery旋轉(zhuǎn)插件—rotate支持(ie/Firefox/SafariOpera/Chrome)
網(wǎng)上發(fā)現(xiàn)一個(gè)很有意思的jQuery旋轉(zhuǎn)插件，支持Internet Explorer 6.0+ 、Firefox 2.0 、Safari 3 、Opera 9 、Google Chrome，高級(jí)瀏覽器下使用Transform，低版本ie使用VML實(shí)現(xiàn),感興趣的朋友可以了解下2013-01-01
Jquery+CSS 創(chuàng)建流動(dòng)導(dǎo)航菜單 Fluid Navigation
有時(shí)，一個(gè)網(wǎng)站的導(dǎo)航菜單文字不能提供足夠的信息，來表達(dá)當(dāng)前菜單按鈕的內(nèi)容，一般的解決辦法是使用提示信息ToolTip，那么本文介紹的流動(dòng)導(dǎo)航菜單Fluid Navigation也可以解決此問題，同時(shí)也為網(wǎng)站設(shè)計(jì)的添加了一些時(shí)尚而又動(dòng)感元素。2010-02-02
jquery下利用jsonp跨域訪問實(shí)現(xiàn)方法
客戶端的跨域訪問，可以通過jsonp方式來實(shí)現(xiàn)，jquery提供了跨域訪問的方法，jQuery.ajax()支持get方式的跨域。當(dāng)然支持跨域還需要服務(wù)器端相應(yīng)的處理。2010-07-07
這篇文章主要介紹了jQuery Easyui一些用法，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的的朋友參考下吧2017-08-08
這篇文章主要是對(duì)jquery合并內(nèi)容相同的單元格示例代碼進(jìn)行了介紹。需要的朋友可以過來參考下，希望對(duì)大家有所幫助2013-12-12
簽到功能現(xiàn)在算是社交化網(wǎng)站增加網(wǎng)站粘合度的一個(gè)普遍做法了，于是也想在自己的項(xiàng)目中添加一個(gè)，經(jīng)過一番度娘，終于完成，這里分享給大家，有需要的小伙伴可以參考下。2015-04-04
jquery Validation表單驗(yàn)證使用詳解
功能強(qiáng)大的 jquery 表單驗(yàn)證插件，適用于日常的 E-mail、電話號(hào)碼、網(wǎng)址等驗(yàn)證及 Ajax 驗(yàn)證，除自身?yè)碛胸S富的驗(yàn)證規(guī)則外，還可以添加自定義的驗(yàn)證規(guī)則。兼容 IE 6+, Chrome, Firefox, Safari, Opera 10+2015-04-04
jQuery選取所有復(fù)選框被選中的值并用Ajax異步提交數(shù)據(jù)的實(shí)例
下面小編就為大家?guī)硪黄猨Query選取所有復(fù)選框被選中的值并用Ajax異步提交數(shù)據(jù)的實(shí)例。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-08-08
本文主要介紹了js實(shí)現(xiàn)表格篩選功能的代碼。具有一定的參考價(jià)值，下面跟著小編一起來看下吧2017-01-01
正好項(xiàng)目中準(zhǔn)備使用thickbox，于是干脆拋棄prototype.js，看起jquery.js了。JQuery確實(shí)不錯(cuò)，體積比Prototype小了許多，而且使用起來更方便更靈活。有人說Prototype像JAVA，正統(tǒng)；而JQuery像Ruby，靈活，更趨于OOP。2009-10-10