Ablauf automatisieren

  • Hallo.

    Ich habe folgendes vor, weiß jedoch nicht ob das realisierbar wäre:

    Es gibt eine Grafik die in einem Absatz steht

    HTML
    <p class="clickable"><img src="images/bild.png"  /></p>

    Dazu gibt es ein Javascript

    Code
    <script type="text/javascript">
    $(document).ready(function() {
               $(".clickable").click(function() {
                  $(this).siblings(".box").slideToggle('slow');
                  if($(this).html()=="Schliessen") {
                      $(this).html("Produktvideo anschauen");
                    } 
               });
    });
    </script>

    Wenn ich auf diese Grafik klicke wird ein DIV aufgeklappt (Slide) und es wird ein Video abgespielt. Klicke ich abermals auf die Grafik slided der Container wieder zu und das Video ist verschwunden. Soweit paßt das auch.

    Jetzt möchte ich aber, dass - nach Beendigung des Videos - dieser DIV automatisch wieder zu slided, ohne dass ich auf die Grafik erneut klicken muss. Geht das irgendwie zu machen?


  • Jetzt möchte ich aber, dass - nach Beendigung des Videos - dieser DIV automatisch wieder zu slided, ohne dass ich auf die Grafik erneut klicken muss. Geht das irgendwie zu machen?

    Wenn es sich um ein eingebettes Video handelt, dann geht das nicht.
    Wenn es jedoch ein HTML5 Video ist, dann kannst du das Event ended abfragen.
    Beipiele zu events und mediaproperties unter http://www.w3.org/2010/05/video/mediaevents.html

    Einmal editiert, zuletzt von explanator (21. Januar 2014 um 09:55)

  • Danke, das bringt mich schon etwas weiter zum Ziel.
    Okay, das Event ended frage ich dann mit Javascript ab. Aber wie kann ich das DIV zu sliden lassen ohne dass ich auf die Grafik klicke?

  • Danke für den Link.
    Ich konnte mich zwar einigermaßen in den Code dort einlesen, weiß aber nicht, wie ich das umsetzen soll / kann dass es für meine Anforderung funktioniert.
    Kannst du mir bitte eine weitere Hilfestellung geben?