I've my divs as
<div id="summary" style=" width: 900px; margin: 0 auto;" >
HTML content
</div>
<div id="details" style=" width: 900px; margin: 0 auto; display: none;" >
Detail content
</divs>
My jquery code is like
$('#button').click( function() {
$('#details').show('slide', { direction: 'right' }, 1000);
$('#summary').hide('slide', { direction: 'left' }, 1000);
});
While implementing this, the div#summary
slides out on the left touching the edge of the monitor display & the div#details
slides in from the right but not from the edge of the monitor display.
I want the div#details
to slide in from the extreme right so that it looks like the div is sliding in from outside the screen.
How will I do that?