插件描述：我们的想法是将一个正常的选择输功能变的更加引人。请注意，CSS转换只能在支持css3浏览器。
我们的想法是将一个正常的选择输功能变的更加引人。请注意，CSS转换只能在支持css3浏览器。
使用方法
1，包括CSS和JQUERY的档案
1 2 3 4 5 6 | <!-- include CSS & JS files --><!-- CSS file --><link rel="stylesheet" type="text/css" href="jquery.dropdown.css" media="screen" /><!-- jQuery files --><script type="text/javascript" src="jquery.js"></script><script type="text/javascript" src="jquery.dropdown.js"></script> |
2，添加你的HTML
1 2 3 4 5 6 7 8 | <!-- Start out with a select input --><select id="cd-dropdown" class="cd-select"> <option value="-1" selected>Choose an animal</option> <option value="1" class="icon-monkey">Monkey</option> <option value="2" class="icon-bear">Bear</option> <option value="3" class="icon-squirrel">Squirrel</option> <option value="4" class="icon-elephant">Elephant</option></select> |
3，现在，将对应id绑定DropDown
1 2 3 4 5 | <script type="text/javascript">$(document).ready(function(){ $( '#cd-dropdown' ).dropdown();});</script> |
选择和选项转化为以下结构：
1 2 3 4 5 6 7 8 9 10 | <div class="cd-dropdown"> <span>Choose an animal</span> <input type="hidden" name="cd-dropdown"> <ul> <li data-value="1"><span class="icon-monkey">Monkey</span></li> <li data-value="2"><span class="icon-bear">Bear</span></li> <li data-value="3"><span class="icon-squirrel">Squirrel</span></li> <li data-value="4"><span class="icon-elephant">Elephant</span></li> </ul></div> |
当在第一跨度点击，下拉插件应用的类“cd-active”到其父，与类“cd-dropdown”的划分。当选择一个选项时，各自的跨度将被插入到所述第一1。
特别申明：
本站所有资源都是由网友投稿发布，或转载各大下载站，请自行检测软件的完整性！
本站所有资源仅供学习与参考，请勿用于商业用途，否则产生的一切后果将由您自己承担！
如有侵权请联系我们删除下架，联系方式：lei1294551502@163.com
- 上一个特效： jQuery过滤器插件fastLiveFilter
- 下一个特效： jQuery自定义工具提示插件DarkTooltip