Toggle Button On-Off

by bizamajig

HTML

<div class="slider-outer">
    <div class="slider"></div>
</div>

CSS

.slider-outer {
    width: 94px;
    height: 27px;
    overflow: hidden;
}
.slider {
    background: url('http://labs.engageinteractive.co.uk/itoggle/images/itoggle.png') 0 -27px;
    width: 147px;
    height: 27px;
}

JavaScript

$('.slider').toggle(function(){
    $(this).animate({marginLeft:'-53px'}, 500);
},function(){
    $(this).animate({marginLeft:'0'}, 500);
});