css überlagerung von video und img...

[NullAhnung]

irgendwie hab ich ein blackout oder es geht nicht...
ich würde gern ein Bild über ein Video legen. Geht das überhaupt?
CODE <div id="wrapper"><!-- BEGIN Wrapper -->
<div id="hands"><img src="<?echo $_SESSION['imagePath']?>hands.gif"></img></div>
<div id="video"><video src="<?echo $_SESSION['imagePath']?>morgen.mp4" autoplay muted></video></div>
</div>
hab es versucht mit folgender Css

CODE #wrapper {
position: relative;
margin:0 auto;
}
#video{postiton:absolute; width: 100%; z-index: 1;}
#hands{postiton:absolute; width: 100%; z-index: 2;}

allerdings gehen die nicht übereinander...

 

[gregi]

Ein HTML Element über einem Video zu platzieren sollte eigentlich funktionierern:
Hier findest Du ein Beispiel http://jsfiddle.net/carmijoon/pZbkX/

 

[NullAhnung]

erstmal dankeschön...., aber nur mit css geht das nicht? hab von JavaScript garkeine Ahnung...

 

[Peter Schneider]

Aber da steht ja CSS-Code....

z-index: 2147483647;

Scheint wohl ein Erfahrungswert zu sein. Möglichst grosser z-index.

 

[Toro]

Hallo,
bin mir nicht ganz sicher was mit "Überlagerung" gemeint ist, aber hab mal etwas zusammen gebrutzelt,
siehe jsfiddle ... ohne javescript und nur inline-styling.
Dazu muss ich noch sagen dass dies wahrscheinlich nicht auf älteren Browser funktioniert. Es gibt auch Unterschiede im neuen Firefox zu Chrome, und ob es in Internet-Explorer überhaupt geht hab ich nicht geschaut. Wie es auf smartphones aussieht bin ich mir auch nicht sicher.

Eine "anständige" Website sollte in allen Browsern richtig funktionieren - ob du daher wirklich mit solchen Sachen spielen willst ist mir fraglich. mann könnte ja sonst das Startbild des videoes ändern.