JQuery Custom dropdown box (DropDown) with source download _jquery

First to show you the effect of the picture, like friends can download the source OH

effect demo source download

 <section class= "main" > <div class= "Wrapper-demo" > <div id= "dd" class= "wrapper-dropdown-1" tabindex= "1" > <span> Manual Network </span> <ul class= "dropdown" tabindex= "" > <li><a href= "#" >jquery Special effects </a ></li> <li><a href= "#" > Site templates </a></li> </ul> </div> </div> </sec tion> </div> <script type= "Text/javascript" src= "Http://libs.useso.com/js/jquery/1.7.2/jquery.min.js"
 ></script> <script type= "Text/javascript" > Function DropDown (el) {this.dd = El;
 This.placeholder = This.dd.children (' span ');
 this.opts = This.dd.find (' Ul.dropdown > Li ');
 This.val = ';
 This.index =-;
 This.initevents ();
 } Dropdown.prototype = {initevents:function () {var obj = this;
 Obj.dd.on (' click ', Function (event) {$ (this). Toggleclass (' active ');
 return false;
 });
 Obj.opts.on (' click ', function () {var opt = $ (this);
 Obj.val = Opt.text ();
 Obj.index = Opt.index (); Obj.placeholdeR.text (' Gender: ' + obj.val);
 });
 }, Getvalue:function () {return this.val;
 }, Getindex:function () {return this.index;}
 } $ (function () {var dd = new DropDown ($ (' #dd '));
 $ (document). Click (function () {$ ('. Wrapper-dropdown-1 '). Removeclass (' active ');
 });
}); </script>

The above is a small series to introduce the JQuery custom dropdown box (DropDown) with the source code download, I hope to help you, if you have any questions please give me a message, small series will promptly reply to everyone. Here also thank you very much for the cloud Habitat Community website support!