You could consider using CSS
clip: rect(top, right, bottom, left); to clip a fixed positioned element to a parent. See demo at http://jsfiddle.net/lmeurs/jf3t0fmf/.
Beware, use with care!
Though the clip style is widely supported, main disadvantages are that:
clip: rect(auto, auto, auto, auto);;
See http://tympanus.net/codrops/2013/01/16/understanding-the-css-clip-property/ for more info.
EDIT: Chrome seems to handle positioning of and CSS3 transforms on child elements a lot better when applying backface-visibility, so just to be sure we added:
-webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; backface-visibility: hidden;
to the main child element.
Also note that it's not fully supported by older / mobile browsers or it might take some extra effort. See our implementation for the menu at bellafuchsia.com.
EDIT 2014-11-02: Demo URL has been updated.
~ Answered on 2014-05-25 20:36:08