html - Transition does not work when position is fixed -
click on icon in codepen see output.
i container fixed. when container fixed transition x icon not work. when click on menu button x icon not have transition.
you need uncomment position fixed see how effects x icon.
https://codepen.io/anon/pen/dzxagb
#container { display: none; /* uncomment position fixed */ /* position: fixed; */ height: 100%; width: 100%; background: blue; z-index: 9999; transition: 0.2s linear; } #menu, #close { position: absolute; top: 4%; right: 2%; transition: 0.3s linear; font-size: 3em; } #close { opacity: 0; }
when click on menu icon can change position of container temporary. it's not best works.
add code:
menu.onclick = function() { container.style.position = 'static'; } x.onclick = function() { container.style.position = 'fixed'; }
Comments
Post a Comment