2009-08-15 28 views
6

Có ai biết plugin plugin lightbox tốt cho đường ray không? Tôi tìm thấy redbox nhưng dường như nó không còn phát triển nữa.Hộp đèn cho đường ray?

Cảm ơn!

-Elliot

Trả lời

5

Tôi chỉ sử dụng Hộp đèn thông thường 2. Bao gồm tất cả javascript và bảng định kiểu thích hợp rồi: rel => "lightbox" trên liên kết của bạn.

+2

Ông có thể xin hãy giải thích về cách bạn thêm javascripts và stylesheets và việc sử dụng trong .html.erb (xem) tập tin ?? –

0

Bạn có thể thử lightbox2, không biết nếu có bất kỳ đường ray cắm để sử dụng nó, nhưng viết một số chức năng helper không nên có khó khăn.

0

Tôi muốn giới thiệu rlightbox. Nó là một plugin UI jquery. Nó có thể được sử dụng cho các hình ảnh và video và các tài liệu là khá tốt

3

Dưới đây là ví dụ làm thế nào để dễ dàng sử dụng hộp đèn trong đường ray (v4 trong trường hợp của tôi):
1. Tải từ trang web: http://lokeshdhakar.com/projects/lightbox2/
2. Sao chép lightbox .js để ứng dụng/tài sản/Javascripts
3. Sao chép lightbox.css để ứng dụng/tài sản/stylesheets
4. Rename lightbox.css để lightbox.css.scss.erb
5. Sao chép bốn img để ứng dụng/tài sản/hình ảnh
6. Chỉnh sửa lightbox.css.scss.erb:
- Tất cả đường dẫn hình ảnh thay thế bằng:

<%=image_path "close.png"%> 

với tên hình ảnh phù hợp.
Thêm thuộc tính hộp đèn dữ liệu vào bất kỳ liên kết hình ảnh nào để kích hoạt Hộp đèn. Đối với giá trị của thuộc tính, hãy sử dụng tên duy nhất cho mỗi hình ảnh. Ví dụ:

<a href="img/image-1.jpg" data-lightbox="image-1" data-title="My caption">Image #1</a> 

Thats all.

+1

Thay vì sử dụng chế biến erb cho tệp css và do đó '<% = image_path ...%>', thay vì chỉ lưu nó dưới dạng 'lightbox.css.scss' và sử dụng' image-url ("close.png") 'trong tập tin thay cho' url (...) '. Không cần phải erb ở đây! –

Các vấn đề liên quan