jQuery Custom Select

by amindunited

HTML

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.6.2/css/bootstrap-select.min.css"/>

<select class="selectpicker">
    <option>Mustard</option>
    <option>Ketchup</option>
    <option>Barbecue</option>
</select>



<script src="//cdnjs.cloudflare.com/ajax/libs/jquery.customSelect/0.5.1/jquery.customSelect.min.js"></script>

CSS

span.customSelect { 
    font:12px sans-serif;
    background:#fff url(http://i48.tinypic.com/2u7rpec.png) right center no-repeat;
    border:1px solid #ddd;
    color:#555;
    padding:7px 9px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px 2px;
    width:175px;
}

JavaScript

$(function(){
    $('.selectpicker').customSelect();
});