Đơn giản, trọng lượng nhẹ, Cross Trình duyệt Lightbox cho trang web của bạn
Không phải là chỉ có một lightbox vài điều mà bạn có thể tìm thấy khi bạn google. Vấn đề với hầu hết các của các lightboxes mà tôi tìm thấy là tất cả họ dường như sử dụng một khuôn khổ cân nặng JAVASCRIPT khác như jQuery, Prototype, MooTools và thích. Họ là tất cả các mát mẻ và khoe khoang tìm kiếm. Nhưng nếu yêu cầu của bạn là "NHƯNG TÔI MUỐN Một SCRIPT lightbox Đơn giản và nhẹ cho SITE CỦA TÔI", sau đó ở đây là;
Một số tính năng tốt đẹp của lightbox này
- Rất nhẹ
a. 4KB của kịch bản khi đóng gói (8 kb giải nén)
b. 2 kb của CSS
c. Vài dòng mã HTML chứa lightbox - Đơn giản để hiểu và thực hiện
- Có thể có Lightboxes nhiều trên cùng một trang.
- Lightbox cùng một container được sử dụng để hiển thị nội dung khác nhau (một cách riêng biệt bao gồm như là những bộ phận ẩn trong trang), tùy thuộc vào liên kết / tùy chọn mà được nhấp.
- Tự động trung tâm, xem xét tất cả các yếu tố như chiều cao và chiều rộng cửa sổ (màn hình độ phân giải), trang số tiền di chuyển và chiều cao của các nội dung của lightbox
- Thử nghiệm trong IE 7 & FF
Xem Demo |
Tải về Lightbox Source Zip (tải về 1.804 lần)
Sử dụng Lightbox [tập tin trong file zip]
jo.js, jo_pack.js [đóng gói phiên bản]: - một tập hợp đơn giản của JAVASCRIPT ĐỐI TƯỢNG [JO], trong đó có yếu tố, cửa sổ và các kịch bản định vị tài liệu. Bạn có thể mở JO.JS nếu bạn muốn để có được bàn tay của bạn bẩn với một số Javascripting nâng cao, tạo ra các chức năng trừu tượng, mở rộng các thuộc tính yếu tố và như vậy. Nếu bạn không quá nhiều trong Javascripting, Để lại nó một mình.
lightbox.js, lightbox_pack.js [phiên bản đóng gói: - Thành phần các kịch bản quản lý hộp ánh sáng. Nếu bạn là nhà thiết kế trang, cũng chịu trách nhiệm với việc thực hiện các lightbox trên trang web, bạn cần hiểu LightBoxManager. LightBoxManager về cơ bản có hai chức năng showLightBox và closeLightBox.
lightbox.css: - Nếu bạn biết CSS, bạn có thể chơi xung quanh với lightbox.css để tùy chỉnh giao diện-n-cảm thấy lightbox.css
index.html: thực hiện mẫu của lightbox với hai nội dung khác nhau
lb_underlay_bkg.png: - Đây là hình ảnh ánh sáng / Simi trong suốt được sử dụng nền cho underlay lightbox [Underlay là lớp dưới đây lighbox, trong đó ngăn chặn người sử dụng từ cách nhấp vào bất kỳ thực thể khác trên trang, trong khi lightbox là mở]. Bạn có thể sử dụng bất kỳ hình ảnh hoặc thậm chí là một màu cho mục đích này, tùy thuộc vào thiết kế trang và yêu cầu.
icon_lb_close.gif: - hình ảnh để xử lý lightbox gần phía trên bên phải của hộp ánh sáng. Có thể sử dụng bất kỳ hình ảnh theo thiết kế
Xem Demo |
Tải về Lightbox Source Zip (tải về 1.804 lần)
Xin vui lòng cho chúng tôi có ý kiến và phản hồi của bạn ...
