html - Video tag at Chrome overlays on top -


other browsers ok, in chrome, video plays on top, ignoring z-index.

following code, , looks strange in chrome.

there absolutely positioned 'iuview_4', shows under video.

what's wrong in chrome? there way handle?

<style>     #page {background-color : rgb(255,255,255); position : relative; z-index : 0; width : 100.0%; margin : auto; height : 1300.0px; }     #movie {background-color : rgb(0,198,245); top : 94.0px; z-index : 0; width : 521.0px; left : 131.0px; height : 242.0px; }     #view {height : 70.0px; width : 100.0px; background-color : rgb(0,164,89); z-index : 1; top : 62.0px; overflow : hidden; left : 435.0px; position:absolute;  } </style> <body >     <div>       <div id='page' >           <div id='movie' >               <video width=100% height=100% poster='res/gazzetta_thumbnail.png' autoplay>                   <source src="http://www.sketchin.ch/en/wp-content/themes/sketchin2013/assets/video/page-home/gazzetta.mp4" type="video/mp4">                   <object data="http://www.sketchin.ch/en/wp-content/themes/sketchin2013/assets/video/page-home/gazzetta.mp4" width="100%" height="100%" /> </object>               </video>           </div>           <div id='view' >                </div>        </div>    </div>  </body> 

we had similar issue on our site, , implemented fix described in stack overflow page.

in our case, added following css relatively positioned overlay (rather fixed position element described in link above), kept disappearing behind video:

-webkit-backface-visibility: hidden; -webkit-transform: translatez(0); 

Comments

Popular posts from this blog

c# - How to get the current UAC mode -

postgresql - Lazarus + Postgres: incomplete startup packet -

javascript - Ajax jqXHR.status==0 fix error -