css - Fixed element in transform translate container not working -


i have wrapper box want animate transform translate if can't use fixed element inside.

example :

<div class="wrapper">     <div class="box-content">         <div class="fixed-element">          </div>     </div> </div>  <style type="text/css">      .wrapper {         transform: translatex(50px);         background: pink;     }      .box-content {         height: 1000px;         background: green;     }      .fixed-element{         position: fixed;         top: 0;         left: 0;         width: 50px;         height: 50px;         background: blue;     }  </style> 

https://jsfiddle.net/aobv5azy/

i don't want use javascript, , want use transform translate. animate "left" not performances.


Comments

Popular posts from this blog

python - No exponential form of the z-axis in matplotlib-3D-plots -

excel vba - VBA Proxy auto-configuration for http requests -

php - phpWord - Tables with borders in headers/footers -