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
![Phải làm sao để khắc phục GPU tăng trên Windows? [Chi tiết A-Z]](http://cdn.trangcongnghe.vn/thumb/160x240/2023-04/phai-lam-sao-de-khac-phuc-gpu-tang-tren-windows.webp)
Phải làm sao để khắc phục GPU tăng trên Windows? [Chi tiết A-Z]
Nếu GPU của bạn đang hoạt động ở mức tăng cao bất thường ngay cả đang chạy các tiến trình sử dụng ít tài nguyên và game mà bạn chơi bị lag, giật hoặc treo bất thường thì có thể do các vấn đề phần mềm hoặc phần cứng.
Xem dung lượng pin còn lại trên tai nghe AirPods nhanh chóng từ Apple Watch
Apple Watch ngày càng trở nên độc lập với iPhone. Với Series 3, Apple đã thêm hỗ trợ LTE cho phép người dùng sử dụng Apple Watch mà không cần iPhone của bạn ở gần.
Microsoft công bố phiên bản mới của Windows 10
Chiến lược phát triển của Microsoft đã thay đổi hoàn toàn trong suốt hai năm qua. Ngoài việc xâm nhập vào thị trường phần cứng, nổi bật là laptop Surface 2 trong 1 mới, dường như hãng cũng có những kế hoạch mới mẻ cho
Apple hưỡng dẫn người dùng sửa lỗi phần trăm pin trên iPhone 6s
Táo khuyết đã giải quyết vấn đề trên bằng cách đăng tải một văn bản hỗ trợ người dùng trên website hỗ trợ của họ, hướng dẫn các thao tác giúp người sử dụng có thể tự khắc phục vấn đề khi xảy ra và cam kết rằng họ đang
Hướng dẫn xoá danh bạ trên iCloud đơn giản và an toàn nhất
Xóa danh bạ trên iCloud là một thao tác không khó nhưng nếu thực hiện sai cách thì bạn có nguy cơ bị mất hết danh bạ. Sau đây chúng tôi sẽ hướng dẫn cách xoá danh bạ trên iCloud trên các thiết bị của Apple một cách đơn
ĐÁNH GIÁ NHANH
Đánh giá tổng quan Infinix Hot S: Thêm một sự lựa chọn trong tầm giá 3 triệu đồng
Infinix Hot S, nổi bật với thiết kế kim loại đẹp mắt, thời lượng sử dụng pin ấn tượng và camera tốt trong tầm giá khoảng 3 triệu đồng ở thời điểm hiện tại.
Những lưu ý trước khi tham gia bảo hiểm nhân thọ
Bảo hiểm nhân thọ trong thời gian gần đây đã gây nên nhiều “làn sóng” dư luận. Cũng từ đây, nhiều khách hàng bắt đầu nghiên cứu kỹ hơn, hiểu đúng về bảo hiểm nhân thọ trong từng điều khoản. Đối với những khách hàng đang
Mazda3 2017 và Corolla Altis 2017: Bạn chọn xe nào?
Trong phân khúc sedan hạng C tại thị trường Việt Nam, Toyota Corolla Altis từng là một tượng đài khó xô đổ. Tuy nhiên, sự vươn lên mạnh mẽ của Mazda3 khiến Altis đánh mất “ngôi vương” và bị đối thủ bỏ xa về doanh số.