Rumah > hujung hadapan web > tutorial js > jquery melaksanakan kod kesan khas pengindahan kotak lungsur pilih

jquery melaksanakan kod kesan khas pengindahan kotak lungsur pilih

PHPz
Lepaskan: 2018-09-29 10:55:19
ke hadapan
1698 orang telah melayarinya

Artikel ini terutamanya memperkenalkan pelaksanaan jquery untuk mencantikkan kotak drop-down pilihan Kesannya mudah dan elegan Ia disyorkan kepada semua orang yang memerlukannya.

Ini ialah kod kesan khas berdasarkan jquery untuk melaksanakan pengindahan kotak lungsur terpilih Pengguna boleh memilih kandungan menu lungsur Ia adalah kod sumber kesan khas yang sangat praktikal.

Pelaksanaan jquery bagi kod kesan khas pengindahan kotak lungsur pilih yang dikongsi dengan semua orang adalah seperti berikut

<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>
<p class="searchbox">
 <p class="searchZone clearfix">
 <form target="_blank">
 <fieldset>
 <label>
 <input type="text" class="text" name="keyword" onblur="if(this.value==&#39;&#39;){this.value=&#39;请输入关键字&#39;;this.style.color=&#39;#aaa&#39;}" onfocus="if(this.value==&#39;请输入关键字&#39;){this.value=&#39;&#39;;this.style.color=&#39;#333&#39;}" value="请输入关键字" />
 </label>
 <p 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>
 </p>
 <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() {$(&#39;#mySle&#39;).selectbox();});</script>
 </p>
</p>
</body>
</html>
Salin selepas log masuk

Penebaran berjalan:

Alamat demonstrasi dalam talian :http://demo.jb51.net/js/2015/jquery-select-xlkmh/

Jika anda mahukan lebih banyak kesan kotak drop-down, anda boleh klik Ringkasan kesan kotak lungsur jquery/JavaScript.

Di atas ialah pelaksanaan jQuery bagi kod kesan khas pengindahan kotak lungsur terpilih yang dikongsi dengan anda. Untuk lebih banyak tutorial berkaitan, sila lawati tutorial video jQuery!

Label berkaitan:
sumber:jb51.net
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan