jquery實現(xiàn)select下拉框美化特效代碼分享
更新時間：2015年08月18日 10:35:39 投稿：lijiao
這篇文章主要介紹了jquery實現(xiàn)select下拉框美化特效,實現(xiàn)效果簡潔大方，推薦給大家，有需要的小伙伴可以參考下。
這是一款基于jquery實現(xiàn)select下拉框美化特效代碼，用戶可以選擇下拉菜單內容，是一款非常實用的特效源碼。
為大家分享的jquery實現(xiàn)select下拉框美化特效代碼如下
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="css/g.css" type="text/css" rel="stylesheet" />
<link href="css/css.css" type="text/css" rel="stylesheet" />
</head>
<body>
<div class="searchbox">
<div class="searchZone clearfix">
<form target="_blank">
<fieldset>
<label>
<input type="text" class="text" name="keyword" onblur="if(this.value==''){this.value='請輸入關鍵字';this.style.color='#aaa'}" onfocus="if(this.value=='請輸入關鍵字'){this.value='';this.style.color='#333'}" value="請輸入關鍵字" />
</label>
<div class="left">
<select style="display: none;" name="mySle" id="mySle">
<option selected="selected" value="0">全站搜索</option>
<option value="1">素材搜索</option>
<option value="2">設計欣賞</option>
<option value="3">桌面壁紙</option>
<option value="4">設計教程</option>
</select>
</div>
<label>
<button type="submit">快給我搜一下</button>
</label>
</fieldset>
</form>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/selectbox.js"></script>
<script type="text/javascript"> $(document).ready(function() {$('#mySle').selectbox();});</script>
</div>
</div>
</body>
</html>
運行效果圖：
如果大家還想深入學習，可以點擊jquery下拉框效果匯總、JavaScript下拉框效果匯總進行學習。
以上就是為大家分享的jquery實現(xiàn)select下拉框美化特效代碼，希望大家可以喜歡。
您可能感興趣的文章:
相關文章
JavaScript使用Promise封裝Axios進行高效開發(fā)
這篇文章主要介紹了JavaScript使用Promise封裝Axios進行高效開發(fā)，Axios是一個基于Promise的HTTP庫，它可以幫助我們更方便地發(fā)起HTTP請求，并且提供了許多高級功能，感興趣的同學可以參考下文2023-05-05
JavaScript 驗證碼的實例代碼(附效果圖)，需要的朋友可以參考一下2013-03-03
uniapp 仿微信的右邊下拉選擇彈出框的實現(xiàn)代碼
這篇文章主要介紹了uniapp 仿微信的右邊下拉選擇彈出框的實現(xiàn)代碼，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-07-07
本文給大家介紹bootstrap按鈕相關知識，包括按鈕大小、按鈕狀態(tài)、按鈕標簽相關樣式定義，對bootstrap按鈕相關知識感興趣的朋友一起學習吧2016-01-01
這篇文章主要為大家詳細介紹了js圖片上傳的封裝代碼，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-08-08
cropper.js和exif.js實現(xiàn)頭像上傳縮放裁剪旋轉
這篇文章主要為大家詳細介紹了cropper.js和exif.js實現(xiàn)頭像上傳縮放裁剪旋轉，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-02-02
在JavaScript中雖沒有類似的方法，但我們可以利用字符串的replace方法自定義字符串的格式化方法。下面通過本文給大家分享使用JS在HTML中自定義字符串格式化的方法，需要的的朋友參考下吧2017-07-07
這篇文章介紹了GRID拖拽行的實例代碼，有需要的朋友可以參考一下2013-07-07
下面小編就為大家?guī)硪黄猨s 顯示日期時間的實例(時間過一秒加1)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-10-10
這篇文章主要介紹了js運算符的一些特殊用法,需要的朋友可以參考下2018-07-07