select 를 꾸며주는 플러그인 (selectric JS)

select 폼을 꾸며주는 

jQuery Selectric 플러그인

일반적으로 select는 css로 원하는 디자인을 꾸며줄 수 없습니다.

플러그인을 이용하여 보다 쉽고 tab 접근성에도 유용한 플러그인을 소개하려 합니다.

http://lcdsantos.github.io/jQuery-Selectric/index.html 

위 URL을 들어가면 Selectric 플러그인 홈페이지가 나옵니다. 

자세한 내용을 확인하려면 홈페이지를 참조하여 주시기 바랍니다.

첨부파일을 첨부하며 첨부파일의 내용은 아래와 같습니다.

* head태그 안에 추가

<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>

* html 추가

<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>

첨부파일을 참조해 주세요~^^

selectric js.zip