Linkselect Placeholder Demo

HTML

<link rel="stylesheet" href="http://www.givainc.com/labs/css/jquery.linkselect.style.select.css">
<script src="http://www.givainc.com/labs/lib/jquery.linkselect.js"></script>
<h2>
    Normal Select
</h2>
<br />
<select>
    <option value="">Select a fruit...</option>
    <option>Apple</option>
    <option>Banana</option>
    <option>Blackberry</option>
    <option>Blueberry</option>
    <option>Cranberry</option>
    <option>Fig</option>
    <option>Grape</option>
    <option>Kiwi</option>
    <option>Lemon</option>
    <option>Lime</option>
    <option>Orange</option>
    <option>Pineapple</option>
    <option>Raspberry</option>
    <option>Strawberry</option>
</select>

<br />
<br />
    
<h2>
    Linkselect Version
</h2>
<br />
<select class="linkselect">
    <option value="" class="placeholder">Select a fruit...</option>
    <option>Apple</option>
    <option>Banana</option>
    <option>Blackberry</option>
    <option>Blueberry</option>
    <option>Cranberry</option>
    <option>Fig</option>
    <option>Grape</option>
    <option>Kiwi</option>
    <option>Lemon</option>
    <option>Lime</option>
    <option>Orange</option>
    <option>Pineapple</option>
    <option>Raspberry</option>
    <option>Strawberry</option>
</select>

CSS

body {
    padding: 25px;
    font: 12px Arial;
}

h2 {
    font-weight: bold;
    font-size: 1.2em;
}

JavaScript

jQuery(function ($){
    $("select.linkselect").linkselect({style: "selectbox"});
});