Photo Booth Strips with Lightbox

Trong ngày hôm nay, chúng tôi sẽ cho bạn thấy làm thế nào để tạo ra một số dải hình ảnh dễ thương và tích hợp Lightbox 2, một trong những kịch bản lightbox phổ biến nhất và được sử dụng rộng rãi. Ý tưởng là để hiển thị một số dải hình ảnh và làm cho họ điều hướng bằng cách di chuyển với mousewheel. Khi nhấp vào một hình ảnh, chúng tôi sẽ hiển thị các phiên bản lớn hơn sử dụng jQuery Lightbox 2. Chúng tôi cũng sẽ tối ưu hóa cho các thiết bị cảm ứng.

Mã chỉnh sửa :


<div class='pb-wrapper pb-wrapper-1'> <div class='pb-scroll'> <ul class='pb-strip'> <li> <a href='images/large/1.jpg' rel='lightbox[album1]' title='Spring'> <img src='images/small/1.jpg' /> </a> </li> <li> <a href='images/large/2.jpg' rel='lightbox[album1]' title='Sunshine'> <img src='images/small/2.jpg' /> </a> </li> <li> <!--...--> </li> <!--...--> </ul> </div> <h3 class='pb-title'>Pure Serenity</h3> </div>



Mỗi wrapper dải ảnh cũng sẽ có một vị trí như lớp pb-wrapper-1, pb-wrapper-2, vv ... Sau đó sẽ xác định vị trí tùy chỉnh, chiều cao và quay cho mỗi hình ảnh.

Từ khoá : Photo, Booth, Strips, with, Lightbox

TIN LIÊN QUAN

Fullscreen Video Slideshow with BigVideo.js

Chúng tôi sẽ hưỡng dẫn làm thế nào để tạo slideshow nền bằng video động hoặc một slider bằng Bigvideo.js một Plugin JQuery khá đẹp

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

Mẹo tiết kiệm pin tối đa cho điện thoại Samsung

Thời lượng pin là vấn đề mà hầu hết người dùng điện thoại quan tâm. Với những thủ thuật đơn giản sau đây, bạn sẽ không lo 'dế yêu' hết pin quá...

13 tính năng tuyệt vời của YouTube ít được biết đến

Rõ ràng, YouTube đã quá quen thuộc với nhiều người dùng. Tuy nhiên, ít người biết đến 13 tính năng vô cùng tuyệt vời sau.

Cách phát trực tiếp, live stream game trên Youtube

Khả năng hỗ trợ phát trực tuyến (live stream) của YouTube đã trở nên tốt hơn. Nếu bạn là người tạo nội dung trên Youtube và muốn phát trực tiếp game trên nền tảng này, hãy thực hiện theo hướng dẫn sau.

Hướng dẫn tạo chương trình giảm giá cho cửa hàng trên Zalo

Với giao diện thân thiện, rất dễ sử dụng, cùng nhiều tính năng hấp dẫn ngay từ khi mới ra mắt Zalo Shop được đông đảo người dùng đón nhận rất nhiệt tình. Ngoài việc cho phép đăng bán sản phẩm, cập nhật sản phẩm mới,

Cách chặn Windows 10 tự động cập nhật nhanh chóng, đơn giản

Ứng dụng miễn phí mang tên StopUpdates10 sẽ giúp bạn làm điều đó. Đầu tiên hãy tải StopUpdates10 ở link dưới, rồi khởi động ứng dụng.

ĐÁNH GIÁ NHANH

Đánh giá Huawei nova 2i: Tiện nghi giá tốt

Huawei cố gắng trang bị khá đầy đủ cho chiếc smartphone chủ lực của hãng trong phân khúc tầm trung.

Đánh giá hiệu năng Meizu PRO 6: Nhanh, mượt và nóng

Meizu PRO 6 là chiếc điện thoại hàng đầu của hãng điện thoại đến từ Trung Quốc với cấu hình cực mạnh mẽ.

Đánh giá chi tiết Redmi 5 Plus: Smartphone giá rẻ, pin trâu, cấu hình tốt

Redmi 5 Plus có 3 phiên bản đen, xanh dương và vàng đồng. Chiếc mình đang dùng để đánh giá chi tiết là phiên bản màu đen. Cảm giác của mình khi cầm chiếc điện thoại này trên tay chính là hơi to và rất đằm tay.