web-dev-qa-db-de.com

Wie kann ich auf meiner eigenen Seite Links erstellen, die wie Deep Links funktionieren und mit einem eingebetteten YouTube / Vimeo auf derselben Seite interagieren?

Kennt jemand eine Technik, mit der Links auf einer Website als Deep-Links zu einem eingebetteten Vimeo/Youtube-Video auf derselben Seite verwendet werden können?

Auf diese Weise kann man Videos in einen Blog-Beitrag oder Ähnliches aufnehmen und bestimmte Teile des Videos über tief verknüpfte Zeitcodes referenzieren. Ich vermute, man würde etwas Javascript-Magie brauchen, um dies zu tun.

In einem anderen Punkt wünschte ich, ich hätte das "Tagging", um die Tags Deep-Linking und Vimeo einführen zu können.

2
thunki

Sie können tief verknüpfte YouTube-Videos einbetten, indem Sie das Attribut "Start" verwenden, um die Wiedergabe zu einer bestimmten Zeit zu starten.

<iframe id="video" width="560" height="349" src="http://www.youtube.com/embed/3CR5y8qZf0Y?start=20" frameborder="0" allowfullscreen></iframe>

Sie können die Startzeit mit JavaScript und jQuery folgendermaßen ändern:

jQuery

function setTheTime(theTime) {
    var videoURL = $('iframe#video').attr('src');
    videoURL = videoURL.replace(/=.+/, "="+theTime+"&autoplay=1");
    $('iframe#video').attr('src',videoURL);
}

$('.time').click(function() {
    var newTime = $(this).attr('href').replace('#','');
    setTheTime(newTime);
});

HTML

<p>Watch this video from <a href="#20" class="time">20 seconds</a> or from <a href="#40" class="time">40 seconds.</a></p><br/><br/>

<iframe id="video" width="560" height="349" src="http://www.youtube.com/embed/3CR5y8qZf0Y?start=0" frameborder="0" allowfullscreen>    </iframe>

Demo
Hier ist eine Arbeitsdemo des Ergebnisses. (Klicken Sie auf die '20 Sekunden 'und '40 Sekunden' Links im "Ergebnis" -Rahmen unten rechts, um zu sehen, ob es funktioniert.)

Notizen
Beachten Sie, dass ich den standardmäßigen YouTube-Einbettungscode geändert habe, um ?start=0 zum src und dem id="video" -Attribut hinzuzufügen, damit wir diesen iframe mit jQuery als Ziel festlegen können.

Sobald Sie dies getan haben, ändern alle Links auf der Seite im <a href="#20" class="time">link text here</a> -Format die Startzeit und spielen das Video automatisch ab.

Ich bin mir nicht sicher, ob dies mit Vimeo möglich ist, da ich mit deren Einbettungscode nicht so vertraut bin.

1
Nick

So verlinken Sie bei YouTube mithilfe von Timecodes, um das gewünschte Bit zu erhalten: http://www.google.com/support/youtube/bin/answer.py?answer=116618

Für Vimeo beschreibt dieses FAQ, wie es geht, aber nur, wenn es sich um Ihr Video handelt: http://vimeo.com/help/faq#chapters

0
paulmorriss