Auto-select and copy to clipboard

by lovromar

HTML

<div id="wrapper">
    <p>Copy to clipboard, auto-select and mailTo:</p>
    <textarea id="linkBox">http://simondonaldson.co.uk/</textarea>
    <div class="centerFloats"> 
        <p class="centerFloatsOffset">
            <a href="#" id="clipboard">Copy to clipboard</a>
            <a href="mailto:?Subject=link&Body=http://simondonaldson.co.uk/">Mail To</a>             
        </p> 
    </div>
</div>

CSS

body{background:#362428;}
#wrapper{width:300px; margin:50px auto; background:#8C3E31; overflow:hidden; padding:10px; border:solid 1px #CCA164;}
.centerFloats{position:relative; float:right; left:-50%; clear:both;}
.centerFloatsOffset{position:relative; left:50%;}
.centerFloatsOffset a{float:left; background:#AB9877; color:#8C3E31; text-decoration:none !important; padding:2px 5px; margin:0 2px; color:#362428;}
p{color:#CCA164; margin-bottom:10px;}
textarea{width:100%; resize:none; background:#D4C19B; border:solid 1px #CCA164; color:#362428; margin-bottom:10px;}

JavaScript

(function($){
    $('document').ready(function(){
        $('#linkBox').bind('focus',function(e){            
            this.select();
        });
        $('#clipboard').click(function(e){
            e.preventDefault();
            //required flash http://code.google.com/p/zeroclipboard/
        });     
    });
})(jQuery);