Verweis auf Video in einem anderem Frame

lksteam

Hallo zusammen,

ich habe mich hier mal durch das Forum gekämpft aber nix passendes gefunden.
Ich hoffe das ihr mir helfen könnt.

Ich bin recht neu in der HTMl Materie und habe folgendes vor.
Ich habe zwei Frames links und rechts.
Auf der linken Seite sollen diverse Links zu Videos (eigene Klettervideos) sein.
Wenn ich den Link anklicke, soll aber das Video im rechten Frame abgespielt werden.

Nun habe ich die Links im linken Frame immer mit einer neuen html-Datei verlinkt.
Meine Frage ist nun, muß ich das so machen oder kann ich nicht einfach schon im linken
Frame alles angeben?

Das ist der Code für den linken Frame.

HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Videos vom Klettern/Bouldern</title>
<style type="text/css">
a:link { text-decoration:none; color:#FF0000; }
a:visited { text-decoration:none; color:#FF9900; }
a:active { text-decoration:none; color:#FFFFFF; }
</style>
</head>
<body bgcolor="#333333" text="#FFFFE5">


<h1 align="center">Verschiedene Videos vom Klettern bzw Bouldern</h1>


<p style="text-align: center;">
<a href="Video.html" target="Daten">Boulder in Frankfurt Boulderwelt 24.05.2013</a>
</p>


</body>
</html>

Alles anzeigen

Hier ist nun die Frage, ob ich wirklich immer über eine andere, hier "Video.html" gehen muß
oder es einen Weg gibt es direkt hier zumachen?

Danke für die Hilfe

lksteam

explanator

Frames sind schon seit Jahren out und man verwendet auch keine Schriftattribute in den HTML-Elementen, wie du das hier gemacht hast:

HTML

<body bgcolor="#333333" text="#FFFFE5">

Sowas gehört ins CSS und das CSS ausgelagert.

Wenn du HTML5 verwendest, kannst du das Video-Element nutzen und mit ein wenig Javascript das jeweilige Video auswählen.
Einzig die Videodateien musst du zwei mal anlegen, da nicht alle Browser in den Videoformaten einig sind, dafrür kannst du dann aber die Videos auch auf den Smartphones betrachten.

siehe auch https://developer.mozilla.org/en-US/docs/HTM…d_media_formats
und
https://developer.mozilla.org/de/docs/HTML/U…audio_and_video

synaptic

und es gibt scripte, die dir das alles noch etwas vereinfachen
http://mediaelementjs.com/

und @ explanator: der TE benutzt html4.0 loose, da is noch alles erlaubt

lksteam

Hallo zusammen,

danke für die Antworten und auch der Kritik/Anregungen in Sachen Frames.

Was sollte man denn anstelle von Frames benutzen. Tabellen?

Wenn ich eure Vorschläge bzgl. meines Videoproblems anschaue, dann verstehe ich nicht, wie
die Videos dann im anderen Frame abgespielt werden. (abgesehen davon, dass man Frames wohl nicht mehr benutzen soll )

Bei mir ist es im Moment so, dass ich im linken Frame einen Link habe, der auf eine andere HTML-Datei verweist.
In dieser HTML-Datei ist dann das Video eingefügt.

linker Frame:

HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Videos vom Klettern/Bouldern</title>
<style type="text/css">
a:link { text-decoration:none; color:#FF0000; }
a:visited { text-decoration:none; color:#FF9900; }
a:active { text-decoration:none; color:#FFFFFF; }
</style>
</head>
<body bgcolor="#333333" text="#FFFFE5">


<h1 align="center">Verschiedene Videos vom Klettern bzw Bouldern</h1>


<p style="text-align: center;">
<a href="Video.html" target="Daten">Boulder in Frankfurt Boulderwelt 24.05.2013</a>
</p>


</body>
</html>

Alles anzeigen

Video.html

HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Videos vom Klettern/Bouldern</title>
</head>
<body bgcolor="#333333" text="#FF3DF5">


<h1 align="center">Boulderwelt Frankfurt</h1>


<p style="text-align: center;">
<embed src="Klettern.mp4" width="320" height="320" >
</p>


</body>
</html>

Alles anzeigen

Mir stellt sich nun die Frage, ob ich immer diesen Weg gehen muß
oder ob ich nicht direkt das Video irgendwie verlinken kann, sodass es im
rechten Frame abgespielt wird.

Danke schonmal und sorry für die Anfängerprobleme

lksteam

synaptic

also wenn du von den frames nicht weg möchtest, kannst du das oben genannte script nutzen und damit das video starten, den code vom script hauste in des html von der videoseite.
tables sind auch gruselig, wenn du keine tabellarischen daten hast...

am einfachsten ist wenn du das ganze mit divs und css umsetzt. siehe boxmodell

schau mal bei css4you.de rein

Bleistift

Zitat von lksteam

Was sollte man denn anstelle von Frames benutzen. Tabellen?
Wie bereits erwähnt, Boxmodell mit Hilfe von divs.

Mir stellt sich nun die Frage, ob ich immer diesen Weg gehen muß
oder ob ich nicht direkt das Video irgendwie verlinken kann, sodass es im
rechten Frame abgespielt wird.

Eine Möglichkeit dafür wäre PHP einzusetzen.-
Du könntest beim Klick auf deinen Link deine Seite neu laden und deine URL mit Hilfe von GET Parametern erweitern.
Im rechten Frame oder Div, je nach dem was du benutzt könntest du dann entsprechend über include deine Datei einholen.

Beispiel:

HTML

<!DOCTYPE html>
<html>
<head>
<link href="verlinkung zur externen css datei" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="leftcontainer">
<a href="deineseite.php?show=video">Video zeigen</a>
</div>


<div id="rightcontainer">
<?php
// pürft ob get parameter vorhanden
if(isset($_GET['show'])) {7
// lädt video.html in den container
include("video.html");
}
?>
</div>


</body>
</html>

Alles anzeigen

Natürlich könntest du auch mit JavaScript deine Datei in deinen rightcontainer laden.
Jedoch etwas aufwendiger als das bisschen php.
Wenn du php verwendest, muss deine Datei eine .php Endung haben!
Deine CSS dazu könnte so aussehen:

Code

div#leftcontainer {
float: left;
width: 100px;
height: 100px;
margin: 0;
}


div#rightcontainer {
float:left;
margin: 0;
width: 100px;
height: 100px;
}

Alles anzeigen

Per # definierst du ein HTML Objekt mit einer ID (left und rightcontainer)
Über float kannst du beide links nebeneinander positionieren.

Die von synaptic erwähnte Seite css4you.de kann ich ebenfalls nur empfehlen.

Hoffe das hat dir etwas geholfen
Ansonsten mal die onclick Funktion von JavaScript anschauen.
Dort könntest du deinen embed Code einfach in deinen rightcontainer schreiben.

Good luck.

Tags