javascript - Opening up my side drawer causes a header with fixed position to move when the page is scrolled -
here's fiddle
i have 2 div elements in body, #drawer , #content. inside div #content header position: fixed.
when top left menu button in header clicked, main #content div translated using css3 transforms , transition simulate "opened" state drawer. it's when problem occurs.
scrolling #content div while #drawer open, or scrolling div little , opening #drawer causes header move top of page, though it's fixed.
not precisely sure problem after little while staring @ it, love few more experienced eyes on i'm trying done possible.
would appreciate guys can offer me. in advance :)
i've had problems when using transform , position:fixed together. in fiddle used transition instead of transform. modified jquery touch, think you'll idea.
the key this:
#content.open, #content.open header{ left: 70%; } #content, header { transition: 300ms left; -webkit-transition: 300ms left; -moz-transition: 300ms left; -o-transition: 300ms left; left: 0; }
Comments
Post a Comment