zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden video zentriet, variable Größe

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 04.04.2011, 10:59
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 04.04.2011
Beiträge: 1
anubisxl befindet sich auf einem aufstrebenden Ast
Standard 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?
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 04.04.2011, 14:51
{ display: random;}
XHTMLforum-Kenner
 
Registriert seit: 08.09.2004
Ort: Stuttgart
Beiträge: 5.034
andir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblick
Standard

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.
__________________
Grüsse Andreas- auch mal wieder da...

Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams)
Wiedergelesen: > hier und hier

[Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Problem mit globaler Variable onkel-tom Javascript & Ajax 9 13.03.2009 11:36
error_reporting(E_ALL); paracelsus Serveradministration und serverseitige Scripte 37 05.06.2008 08:36
iframe Größe bei Laden des Inhalts an dessen Größe anpassen wiseguy Javascript & Ajax 0 24.06.2007 23:04
variable DIV Größe mit festen Abstand zum Header target-8 CSS 12 20.04.2005 22:22


Alle Zeitangaben in WEZ +2. Es ist jetzt 21:10 Uhr.