Fullscreen Video Slideshow with BigVideo.js



Đầu tiên, chúng ta hãy đánh dấu cho trang:

Chúng tôi sẽ làm trên trung tâm của màn hình, chúng tôi có một div wrapper có chứa tất cả các màn hình khác nhau. Sau đó, có một nút chúng tôi sẽ sử dụng để di chuyển giữa các màn hình.


<header> <h1>Fullscreen Video Slideshow <span>with BigVideo.js</span></h1> <p>The videos in this demo are from <a href='http://beachfrontprod.blogspot.com' target='_blank'>Beachfront B-Roll</a>, a great place to download unique HD stock video footage and animated backgrounds for any production purpose (for free!).</p> <p><small>A demo for</small> <a href='http://dfcb.github.com/BigVideo.js/' target='_blank'>BigVideo.js</a> <small>by <a href='http://twitter.com/johnpolacek' target='_blank' rel='author'>@johnpolacek</a></small></p></header> <div class='wrapper'> <div class='screen' id='screen-1' data-video='vid/bird.mp4'> <img src='img/bird.jpg' class='big-image' /> <h1 class='video-title'>#1 Bird</h1> </div> <div class='screen' id='screen-2' data-video='vid/satellite.mp4'> <img src='img/satellite.jpg' class='big-image' /> <h1 class='video-title'>#2 Satellite</h1> </div> <div class='screen' id='screen-3' data-video='vid/camera.mp4'> <img src='img/camera.jpg' class='big-image' /> <h1 class='video-title'>#3 Camera</h1> </div> <div class='screen' id='screen-4' data-video='vid/spider.mp4'> <img src='img/spider.jpg' class='big-image' /> <h1 class='video-title'>#4 Spider</h1> </div> <div class='screen' id='screen-5' data-video='vid/dandelion.mp4'> <img src='img/dandelion.jpg' class='big-image' /> <h1 class='video-title'>#5 Dandelion</h1> </div></div> <nav id='next-btn'> <a href='#' class='next-icon'></a></nav>

TIN LIÊN QUAN

Photo Booth Strips with Lightbox

Băng ảnh đứng đẹp mắt với Lightbox 2 di chuyển bằng cách lăn bi với phong cách lạ với 'Photo Booth Strips with Lightbox'

BookBlock: A Content Flip Plugin

Một plugin jQuery mà sẽ tạo ra một thành phần giống như cuốn sách nhỏ cho phép bạn điều hướng thông qua các mục của nó bằng cách đảo các trang với hiệu ứng (BookBlock: A Content Flip Plugin )

Creative Web Typography Styles

Với một chút CSS ma thuật, chúng ta có thể chuyển đổi văn bản vào kiểu chữ rất đẹp và bỏ qua việc sử dụng các hình ảnh trong nhiều trường hợp

Old School Cassette Player with HTML5 Audio

Vintage định dạng đáp ứng công nghệ web hiện đại: máy nghe nhạc âm thanh HTML5 với các điều khiển thực tế. Hôm nay chúng tôi muốn chia sẻ một máy nghe nhạc âm thanh với giao diện trông giống như một băng nhạc trường học cũ.

THỦ THUẬT HAY

Hai cách ẩn tên và địa chỉ email của bạn trong màn hình đăng nhập

Các bước bên dưới hoạt động với Windows 8 và Windows 10 và sẽ được áp dụng cho tất cả tài khoản người dùng trên PC của bạn. Lưu ý rằng nếu bạn đang sử dụng Windows 10 Home edition, bạn sẽ cần sử dụng phương thức đăng

Cách đổi mật khẩu WiFi, đổi pass Wi-fi FPT, Tenda, TP-Link, Linksys, VNPT

Đổi mật khẩu wifi cho modem là cách bảo mật thông tin dữ liệu trên đường truyền Internet tốt nhất sau một thời gian dài sử dụng. Hoặc chỉ đơn giản là bạn không muốn cho người khác biết mật khẩu wifi của mình nữa.

Hướng dẫn Livestream trên Instagram đơn giản nhất

Mới đây Instagram đã tung ra tính tính Live videos như trên Facebook giúp người dùng có thể giao lưu, nói chuyện với bạn bè, những người theo dõi...

Windows 10 Pro bản cao cấp có gì đặc biệt?

Mới đây Microsoft đã chính thức xác nhận họ sẽ cho ra mắt phiên bản Windows 10 Pro for Workstation, đây là phiên bản cao cấp của Windows 10 Fall Creators Update. Vậy Windows 10 Pro bản cao cấp có gì đặc biệt?

Cài Android trên máy tính bằng Virtualbox

Cài Android trên máy tính Windows, Mac, Linux bằng VirtualBox giúp bạn có thể trải nghiệm Android 7.0, 6.0 mới nhất trên máy tính mà không cần phải sắm phần cứng tương ứng. Hãy tham khảo hướng dẫn cài Android trên

ĐÁNH GIÁ NHANH

Đánh giá LENOVO LEGION 5I PRO (2022): chơi game nhanh, mượt.

Phiên bản 2022 này có gì mới? Nó nhanh hơn, với sự hỗ trợ của bộ vi xử lý mới nhất Intel thế hệ thứ 12 và bộ vi xử lý AMD’s Ryzen 6000 H-series, cùng với các GPU mới và mạnh mẽ hơn.