Próbuję kontrolować filmy HTML5 za pomocą JQuery. Mam dwa klipy w interfejsie z zakładkami, w sumie jest sześć zakładek, pozostałe mają tylko obrazy. Próbuję sprawić, aby klipy wideo były odtwarzane po kliknięciu ich karty, a następnie zatrzymywały się po kliknięciu dowolnego z pozostałych.
To musi być prosta rzecz, ale wydaje się, że nie mogę jej uruchomić, kod, którego używam do odtwarzania wideo to:
$('#playMovie1').click(function(){
$('#movie1').play();
});
Czytałem, że element wideo musi być odsłonięty w funkcji, aby móc go kontrolować, ale nie mogę znaleźć przykładu. Jestem w stanie sprawić, że będzie działać za pomocą JS:
document.getElementById('movie1').play();
Każda rada byłaby świetna. Dzięki
źródło
$('video').each(this.play());
grać wszystkie;$('video').each(this.pause());
zatrzymać wszystko.each()
to funkcja jQuery, do której przekazana jest funkcja javascript, która jest stosowana do każdego elementu. Ponieważ każdy element jest obsługiwany,this
reprezentuje ten element..get(0)
go[0]
. Tak$('video')[0].play();
lub dla konkretnego identyfikatora$('#videoId')[0].play();
.Oto jak udało mi się sprawić, aby działało:
Wszystkie moje tagi HTML5 mają klasę „myHTMLvideo”
źródło
this.paused ? this.play() : this.pause();
Możesz to zrobić
źródło
Dlaczego musisz korzystać z jQuery? Proponowane rozwiązanie działa i prawdopodobnie jest szybsze niż konstruowanie obiektu jQuery.
źródło
play
obiektu jQuery).movie1
pośrednictwem$('movie1')
innych działań jQuery, to jest w porządku; Jeśli jednak robisz to tylko w tym jednym miejscu, zauważysz pewną utratę wydajności. Może to nie być wystarczająco zauważalne, ale lubię dużo optymalizować.W przypadku wstrzymywania wielu filmów stwierdziłem, że działa to dobrze:
Można to włączyć w funkcję kliknięcia, która jest całkiem przydatna.
źródło
Jako rozszerzenie odpowiedzi samotnego dnia możesz także użyć
Zauważ, że nie ma wywołanej funkcji jQuery get () lub eq (). Tablica DOM używana do wywoływania funkcji play (). To skrót, o którym należy pamiętać.
źródło
Podoba mi się ten:
Mam nadzieję, że to pomoże.
źródło
Używam FancyBox i jQuery do osadzania wideo. Podaj identyfikator.
Być może nie NAJLEPSZE rozwiązanie może przełączać odtwarzanie / pauzę w inny sposób - ale łatwe dla mnie i TO DZIAŁA! :)
w
`
źródło
To proste metody, których możemy użyć
na przycisk kliknięcia jquery
Dzięki
źródło
Dla przypomnienia sprawdź, czy przeglądarka obsługuje funkcję wideo, zanim spróbujesz ją wywołać:
Zapobiegnie to błędom JavaScript w przeglądarkach, które nie obsługują tagu wideo.
źródło
Przez JQuery za pomocą selektorów
Przez Javascript przy użyciu identyfikatora
LUB
źródło
Użyj tego..
$('#video1').attr({'autoplay':'true'});
źródło
Sprawiłem, że działało to tak:
źródło
@loneSomeday pięknie to wyjaśnił, tutaj jedno rozwiązanie, które może również dać ci dobry pomysł, jak osiągnąć funkcjonalność odtwarzania / pauzy
odtwarzanie / pauza wideo po kliknięciu
źródło
źródło
źródło
źródło