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

Popular posts from this blog

resizing Telegram inline keyboard -

command line - How can a Python program background itself? -

php - "cURL error 28: Resolving timed out" on Wordpress on Azure App Service on Linux -