Bootstrap 4 Modalna autoodplay wideo i zatrzymaj się po zamknięciu
Framework CSS, bootstrap, pomaga programistom rozwijać responsywne strony internetowe. Modal jest jednym z ważnych komponentów bootstrap, który pozwala wyświetlać treść w oknie wyskakującym. Jednak responsywny modat wideo można również tworzyć w Bootstrap. JavaScript jest zaimplementowany w oknie modalnym, aby dodać główne funkcje.
Ten zapis opisuje modalną autoblację wideo Bootstrap 4 i zatrzyma się po zamknięciu.
Bootstrap 4 Modalna autoodplay wideo i zatrzymaj się po zamknięciu
Modal wideo można tworzyć za pomocą klasy modalnej Bootstrap. Modalna wyskakujące okienko wideo składa się z wideo w oknie dialogowym.
Warunek: Utwórz modal
Aby utworzyć modalny, dodaj następujący kod:
- Najpierw dodaj „„Element z klasą”pojemnik".
- W środku dodaj „
Dodaj kod JavaScript
Aby dodać właściwą funkcjonalność, dodaj kod JavaScript, postępując zgodnie z instrukcjami:
- Dodaj element „”.
- Wewnątrz dodaj „$ (dokument).gotowy () ”, który działa dopiero gdy DOM wykonuje JavaScript.
- Utwórz zmienną „Videopath”I przypisz„ SRC ”danych do zmiennej po kliknięciu.
- Następnie uzyskaj dostęp do elementu według ID i zastosuj „Zastosuj„pokazane.BS.modalny". To wyświetli modalne i uruchomi funkcję. Funkcja przypisuje SRC zmiennej „wideopath” do „