• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Daten aus Datensätze in Echtzeit verwenden

Tabula_Rasa

Mitglied
Hallo,

Der folgende Code sorgt dafür, dass beim Klicken auf ein Bild ein Tab geöffnet wird mit entsprechendem Link:

HTML:
<h1 style="text-align:center;">Music</h1>
<br>
<div class="row">
    @if (count($musics) > 0)
        @foreach ($musics as $music)
            <div class="col-md-3" style="margin-bottom:15px;padding-top:10px" onmouseover="this.style.border='1px solid';" onmouseout="this.style.border='none';">
                <a href="{{$music->link_path}}" target="_newtab"><img src="{{$music->pic_path}}" style="width:100%;height:200px;" alt="time"></a>
                <br><br>
                <h3>{{$music->title}}</h3>

Es werden hauptsächlich Youtube-Videos geöffnet. Youtube bietet einen Code zum Einbetten an, wie z.B. der hier:
HTML:
<iframe width="560" height="315" src="https://www.youtube.com/embed/09R8_2nJtjg" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>

Mir wäre es lieber, wenn der einzubettende Code benutzt werden würde und bei einem Klick der Link in der src-Sektion geändert wird und das Video sichtbar wird. Sobald ein anderes Bild angeklickt wird (zu jedem Bild wird ein Link zugeordnet) soll der neue Link eingefügt werden und das neue Video soll abgespielt werden. Der einzubettende Code würde dann folgendermaßen aussehen:

HTML:
<iframe width="560" height="315" src="{{$music-link_path}}" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>

Die Frage ist, wie ich es hinbekomme, dass ein neues Video angezeigt wird nach einem neuen Klick? Jede Änderung müsste ja in Echtzeit überprüft werden und der Einträg des neuen Datensatzes ausfindig gemacht und in den Code eingesetzt werden. Wie genau bekomme ich das hin?

PS: Ich benutze das Framework Laravel 5.6
 

scbawik

Senior HTML'ler
Hallo,

Der folgende Code sorgt dafür, dass beim Klicken auf ein Bild ein Tab geöffnet wird mit entsprechendem Link:

HTML:
<h1 style="text-align:center;">Music</h1>
<br>
<div class="row">
    @if (count($musics) > 0)
        @foreach ($musics as $music)
            <div class="col-md-3" style="margin-bottom:15px;padding-top:10px" onmouseover="this.style.border='1px solid';" onmouseout="this.style.border='none';">
                <a href="{{$music->link_path}}" target="_newtab"><img src="{{$music->pic_path}}" style="width:100%;height:200px;" alt="time"></a>
                <br><br>
                <h3>{{$music->title}}</h3>

Es werden hauptsächlich Youtube-Videos geöffnet. Youtube bietet einen Code zum Einbetten an, wie z.B. der hier:
HTML:
<iframe width="560" height="315" src="https://www.youtube.com/embed/09R8_2nJtjg" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>

Mir wäre es lieber, wenn der einzubettende Code benutzt werden würde und bei einem Klick der Link in der src-Sektion geändert wird und das Video sichtbar wird. Sobald ein anderes Bild angeklickt wird (zu jedem Bild wird ein Link zugeordnet) soll der neue Link eingefügt werden und das neue Video soll abgespielt werden. Der einzubettende Code würde dann folgendermaßen aussehen:

HTML:
<iframe width="560" height="315" src="{{$music-link_path}}" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>

Die Frage ist, wie ich es hinbekomme, dass ein neues Video angezeigt wird nach einem neuen Klick? Jede Änderung müsste ja in Echtzeit überprüft werden und der Einträg des neuen Datensatzes ausfindig gemacht und in den Code eingesetzt werden. Wie genau bekomme ich das hin?

PS: Ich benutze das Framework Laravel 5.6

Was ist jetzt aber die konkrete Frage?
Dein Vorschlag geht ja schon in die richtige Richtung (Bis auf den Syntaxfehler: {{$music->link_path}})
 

Tabula_Rasa

Mitglied
Was ist jetzt aber die konkrete Frage?
Dein Vorschlag geht ja schon in die richtige Richtung (Bis auf den Syntaxfehler: {{$music->link_path}})
Ich möchte nicht mehr, dass bei einem Klick auf das Bild auf die Youtube Seite mit dem entsprechendem Link in einem neuen Tab geöffnet wird, sondern dass bei einem Klick auf das Bild der Youtube Player auf derselben Seite sich öffnet und das Video auf derselben Seite abspielt und bei einem Klick auf ein anderes Bild soll der Youtube Player auf das andere Video wechseln. Wie genau bekomm ich das hin? Ich bräuchte da Ansätze..
 

Tabula_Rasa

Mitglied
Habe es geschafft. Nur noch zwei Fragen. Ich benutze zweimal iframe: Die Werte beider werden geändert. Kann ich spezifizieren, was verändert wird mittels id oder dergleichen? 2. Auch wenn nichts ausgewählt wurde nimmt iframe Platz ein. Kann ich dafür sorgen, dass nur wenn ein Wert vorhanden ist das Video auftaucht und wenn nicht verschwindet es komplett und der Platz, der eingenommen wird, ebenfalls?

Edit: Problem 1 gelöst mithilfe einer id. Problem 2 besteht
 
Zuletzt bearbeitet:

basti1012

Senior HTML'ler
zu1 ja id geht natürlich.
zu 2 display none würde helfen
*** Link exestiert nicht mehr ***

Der blendet jetzt am Anfang das iframe aus und wenn du die Bilder anklicks ist es wieder sichtbar.Iframe hat jetzt eine id.

Es gibt eine Function die beim Ende des Videos Feuert. Damit könnte man den Iframe am Ende eines Videos automatisch ausbelnden lassen.
Ich bekomme es aber nur über den <video> Tag hin und nicht über den Iframe.
Wenn hier einer das ließt und weiß wie man das Event beim Ende die Videos feuern läßt dann bitte posten,bzw mit in das Script rein bauen.

Ich werde das auch mal weiter testen ob das irgendwie geht.Aber ohne <video> Tag und dann noch im Iframe weiß ich nicht ob und wie das geht.Ich werde mal googeln und wenn ich oder wer anders was weiß können wir die Funktion da noch mit einbauen.
 
Zuletzt bearbeitet:

Tabula_Rasa

Mitglied
zu1 ja id geht natürlich.
zu 2 display none würde helfen
http://sebastian1012.bplaced.net/homepagebasti1012/forumscripte_juni2018/youtube_einbinden.php

Der blendet jetzt am Anfang das iframe aus und wenn du die Bilder anklicks ist es wieder sichtbar.Iframe hat jetzt eine id.

Es gibt eine Function die beim Ende des Videos Feuert. Damit könnte man den Iframe am Ende eines Videos automatisch ausbelnden lassen.
Ich bekomme es aber nur über den <video> Tag hin und nicht über den Iframe.
Wenn hier einer das ließt und weiß wie man das Event beim Ende die Videos feuern läßt dann bitte posten,bzw mit in das Script rein bauen.

Ich werde das auch mal weiter testen ob das irgendwie geht.Aber ohne <video> Tag und dann noch im Iframe weiß ich nicht ob und wie das geht.Ich werde mal googeln und wenn ich oder wer anders was weiß können wir die Funktion da noch mit einbauen.
Danke dir! Solange lass ich es auf dem Display mittels Css nicht anzeigen :).
 
Werbung:

Neueste Beiträge

Oben