I was recently tasked with replicating http://www.rasikarestaurant.com/rasika.html in HTML5 and jQuery.
I'm currently struggling to do the effect where the menus slide up behind the images when an arrow is clicked (See the Menu section for the best example) and was wondering if this is actually possible in jQuery.
So far I have http://jsfiddle.net/wxRnf/1/ which is sort of getting there but I'm not sure it's the best approach.
Any advice you could offer would be great! Thanks.
The image makes a good reference point. So by using the currently clicked element and by finding the nearest sibling 'the-box' you can gather all the html elements. Then you can clone them, but hidden, to either before or after the-box depending if you found a prev or next sibling. Finally you execute an animation close at the same time as an animation up to get the one disappears/one appears affect. Definitely doable I would say.