Question

I’m not sure where to begin. Can someone point me in the right direction? Not looking for code, just guidance.

When a link is clicked, I want a panel (the height of the screen) to slide out from the right to about 50% of the window.

How can I accomplish something like this?

If I just do slidetoggle, it goes up/down. But not sure how to come out from the right side of the browser?

Answer 1

You want to use jQuery’s animate function on the elements width.

<div id="mydiv" style="width:0%;"></div>

On click:

$('#mydiv').animate({'width':'50%'});

You will probably get better results using some positioning and animating the element’s “left” property, but animate() is what you need.