스크립트/Plugin
select 를 꾸며주는 플러그인 (selectric JS)
커드만
2016. 3. 14. 22:48
select 폼을 꾸며주는
jQuery Selectric 플러그인
일반적으로 select는 css로 원하는 디자인을 꾸며줄 수 없습니다.
플러그인을 이용하여 보다 쉽고 tab 접근성에도 유용한 플러그인을 소개하려 합니다.
http://lcdsantos.github.io/jQuery-Selectric/index.html
위 URL을 들어가면 Selectric 플러그인 홈페이지가 나옵니다.
자세한 내용을 확인하려면 홈페이지를 참조하여 주시기 바랍니다.
첨부파일을 첨부하며 첨부파일의 내용은 아래와 같습니다.
* head태그 안에 추가
1 2 3 4 5 6 7 8 9 | <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script src="jquery.selectric.min.js"></script> <link rel="stylesheet" id="theme" href="selectric.css" /> <script type="text/javascript"> $(function(){ $('.tric_01').selectric(); }); </script> | cs |
* html 추가
1 2 3 4 5 6 7 8 | <div class="customer_sel_wrap"> <select class="tric_01"> <option value="">Select with few options</option> <option value="apple">Apple</option> <option value="banana">Banana</option> <option value="orange">Orange</option> </select> </div> | cs |