full width background slide toggle
by kyllle
HTML
<div id="bar"></div>
<br />
<br />
<a href="#">Click</a>
CSS
#bar{
height: 10px;
background: #000;
width: 100%;
position: absolute;
top: 0px;
left: 0;
}
JavaScript
$(document).ready(function() {
$('#bar').css('width', 0);
$('a').click(function(e) {
if($('#bar').hasClass('extended')) {
$('#bar').removeClass('extended').animate({ width: 0 }, 275);
} else {
$('#bar').addClass('extended').animate({ width: '100%'}, 275);
}
e.preventDefault();
});
});