jQuery.simpleselect demo

More information, documentation and download on the project's page : http://pioul.fr/jquery-simpleselect/

HTML

<script src="http://pioul.fr/ext/jquery_simpleselect/jquery.simpleselect.min.js"></script>
<link rel="stylesheet" href="http://pioul.fr/ext/jquery_simpleselect/jquery.simpleselect.css">
<select id="the_select" name="the_select">
    <option value="1">One</option>
    <option value="2" selected="selected">Two</option>
    <option value="3">Thdfsfsdfsfd sfsdfree sd fsdfsdf sdfsd fsdfsdf df sd fsd f </option>
    <option value="4">Four</option>
</select>

CSS

body {
    margin: 200px;
    font-family: Tahoma, sans-serif;
}

JavaScript

$("#the_select")
    .simpleselect({
        fadeSpeed: 0
    })
    .bind("newvalue.simpleselect", function(e, d){
        console.log("This is the 'change' event, with additional data by its side:\nThe selected option's value: "+ d.val +"\nThe selected option's text: "+ d.text +"\nThe selected option (a jQuery object)\nSee the entire object below:");
        console.log(d);
    })
    .bind("pressedEnter.simpleselect", function(){
        console.log("The enter key has been pressed. This can be subscribed to in order to know when to focus the next form input.");
    });