jquery美化選擇器實例有：邊框、下劃線、 伸縮 、滑動、 覆蓋、 旋轉、 彈出層選擇 、環形效果。 線上預覽 實例代碼 <body class="demo-1"> <div class="container"> <header class="codrops-header"> <h1> 自定義選擇 ...
jquery美化選擇器實例有：邊框、下劃線、 伸縮 、滑動、 覆蓋、 旋轉、 彈出層選擇 、環形效果。
實例代碼
<body class="demo-1">
<div class="container">
<header class="codrops-header">
<h1> 自定義選擇元素</h1>
<nav class="codrops-demos">
<a class="current-demo" href="index.html">邊框</a>
<a href="index2.html">下劃線</a>
<a href="index3.html">伸縮</a>
<a href="index4.html">滑動</a>
<a href="index5.html">覆蓋</a>
<a href="index6.html">旋轉</a>
<a href="index7.html">彈出層選擇</a>
<a href="index8.html">環形效果</a>
</nav>
</header>
<section>
<select class="cs-select cs-skin-border">
<option value="" disabled selected> 聯繫人方式</option>
<option value="email">E-Mail</option>
<option value="twitter">Twitter</option>
<option value="linkedin">LinkedIn</option>
</select>
</section>
</div><!-- /container -->
<script src="js/classie.js"></script>
<script src="js/selectFx.js"></script>
<script>
(function() {
[].slice.call(document.querySelectorAll('select.cs-select')).forEach(function(el) {
new SelectFx(el);
});
})();
</script>
</body>
