你的位置:首页 > Java教程

[Java教程]jQuery自定义漂亮的下拉框插件8种效果


jquery美化选择器实例有:边框、下划线、 伸缩 、滑动、 覆盖、 旋转、 弹出层选择 、环形效果。



 

 

在线预览

 

实例代码

<body >    <div >      <header >        <h1> 自定义选择元素</h1>        <nav >          <a 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 >          <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>