[FRAGE] HTML5 Video Safari Version 5 und 6

[Lengen1971]

Hallo Forum,

ich hab eine Frage zu einem Script. Ich habe einige Videos in einer Seite, von denen immer nur eins laufen soll.
Auf Klick eines Buttosn soll sich das aktive ausblenden und das neue loslaufen.
Funktioniert im IE 9,10,11, Safari 7 und FF. NUR im Safari 5 und 6 nicht:

HTML:

<div class="dppb-frame">
   <div class="dppb"><a class="appb appb1" href="#" onClick="playVid(this,'video_1');return false;"></a></div>
   <div class="dppb"><a class="appb appb2" href="#" onClick="playVid(this,'video_2');return false;"></a></div>
....
</div>

<video id="video_1" class="pp_video" muted width="960" >
  <source src="tl_files/MEDIATHEK/VIDEO_3/Video_1.mp4" type="video/mp4" />
  <source src="tl_files/MEDIATHEK/VIDEO_3/Video_1.ogg" type="video/ogg" />
</video>
<video id="video_2" class="pp_video" muted width="960">
  <source src="tl_files/MEDIATHEK/VIDEO_3/Video_2.mp4" type="video/mp4" />
  <source src="tl_files/MEDIATHEK/VIDEO_3/Video_2.ogg" type="video/ogg" />
</video>
....

Script:

<script language="JavaScript" type="text/javascript">
// erstes Video starten
var vid=document.getElementById('video_1');
vid.style.zIndex=1000;
vid.style.display="block";
vid.load();
vid.play();

function playVid(anker,id)
{
    $$('a.appb').removeClass('aktiv');
    anker.addClass('aktiv');
    // laufendes Video anhalten
    vid.pause();
    vid.style.zIndex=900;
    vid.style.display="none";
    
    // gewähltes Video starten
    vid=document.getElementById(id);
    vid.setStyle("display","block");
    
    vid.style.zIndex=1000;
    vid.load();
    if (vid.paused) vid.play();
}
</script>

Das erste Video wird einwandfrei dargestellt, bei Klick verschwindet es, das nächste wird aber nicht angezeigt.

Danke für Tipps.
Gruß
Michael

 

[Lengen1971]

Hi,

Saf 5 und 6 unterstützen .load() nicht. Kommt zwar auch kein Fehler aber es geht, wenn man den Aufruf wegläßt. Ist eh unnütz.

Gruß
Michel

 

[kkapsner]

Kleine Bemerkungen zum Code:
1. das language-Attribut ist veraltet -> weg damit
2. es heißt onclick
3. globale Variablen sollte man vermeiden. Erzeugen zu schnell schwer nachzuvollziehende Fehler. Kapsle deswegen deine Funktion besser in einen anonymen Funktionsscope und mache nur playVid öffentlich.
4. href="#" ist jetzt nicht dein Ernst...