XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   video zentriet, variable Größe (http://xhtmlforum.de/showthread.php?t=64257)

anubisxl 04.04.2011 10:59

video zentriet, variable Größe
 
Hallo,

ich erstelle gerade eine Visitenkarten-Homepage, d.h. eine einfache HTML Seite mit Hintergrundbild und einem Video in der Mitte der Seite.
Ein paar Hintergrunddaten:
ich benutze Firefox 4 zum testen
Scrollbalken sind deaktiviert
Videohoster: Vimeo
Das Video soll IMMER in der Mitte der Seite bzw. des Browserfensters sein
Das Video soll sich dynamisch mit der Größe des Browserfensters ändern (wird das Fenster verkleinert, verkleinert sich auch das Video)
Javascript sollte nach Möglichkeit nicht verwendet werden

Im Internet gibt es die verschiedensten Ansätze, leider hat bei mir aber noch keiner funktioniert :(
Hier ist was ich bisher habe:

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>

<HEAD>


<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=ISO-8859-1">
<META NAME="Generator" CONTENT="NetObjects Fusion 7.5 für Windows">
<TITLE>
Home
</TITLE>

</HEAD>

    <style type="text/css">
            html { height: 100%; overflow:hidden;}
                        body { background-color: transparent; margin: 0px; padding: 0px; height: 100%; border-top: 1px transparent solid; margin-top: -1px; z-index:0; position:relative; }
      img#bg { height: 100%; width: 100%; z-index: -1; position:absolute; color: white; }
      iframe#video { width: 100%; max-width: 100%; }
      div.video { vertical-align: middle; text-align: center; align=middle; max-width: 100%; height:50%; width: 50%; z-index: 1; position:relative; }
        </style>
       
<BODY>
 
<img src="Page-v1.jpg" id="bg">
<center>
<div class="video">
<iframe id="video" src="http://player.vimeo.com/video/21604065" frameborder="0"></iframe>
</div>
</center>
</BODY>

</HTML>

Das Video befindet sich vertikal nicht in der Mitte und ändert sich auch nicht dynamisch mit der Größe des Browserfensters.

Kann mir jemand weiterhelfen?

andir 04.04.2011 14:51

Eine funktionierende Anleitung findest Du hier:

Horizontales und vertikales Zentrieren

Dabei bleibt aber die Größe des zentrierten Elements unverändert.
Wüßte auch nicht wie anders lösen...MUSS sich das Video in der Größe anpassen, es ist ja eh ein iframe, so dass Du die Werte dort ändern müsstest, damit das Video (nicht nur das iframe) mitskaliert.


Alle Zeitangaben in WEZ +2. Es ist jetzt 02:27 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2023