Tôi đã triển khai giải pháp chú thích cho shadowbox sử dụng thẻ nội tuyến 'rev'.Làm cách nào để tùy chỉnh chú thích của shadowbox.js?
Trong shadowbox.js Add ...
...get("sb-caption").innerHTML=obj.link.rev||"";...
...<div id="sb-caption"></div>...
Trong shadowbox.css thêm dòng sau vào dưới cùng của file ...
#sb-info,#sb-info-inner{height:56px;line-height:20px;}
#sb-caption {clear:both;font-size:90%;height:auto;line-height:12px;color:#fff;}
Trong đánh dấu trang của bạn thêm thuộc tính rev (vâng, đó là thuộc tính hợp lệ như rel!) cho liên kết ... văn bản phụ đề đi vào thuộc tính rev ...
<a href="myimage.jpg" rel="shadowbox" title="My Image" rev="Your caption goes here...">My Image</a>
Đó là tôi t ... tận hưởng!
Giải thích thêm tại đây: http://shadowbox.1309102.n2.nabble.com/Captions-td2643307.html
Đây là một điều rất dễ thực hiện.
Tuy nhiên, tôi đã tạo CSS của riêng tôi ...
#sb-caption{text-align:right;line-height:22px;color:#333;position:absolute;bottom:35px;right:35px;background:rgba(255,255,255,0.3);text-shadow: 1px 1px 1px #fff;display:block; padding:10px 20px 10px 50px;z-index:10;}
này tất cả làm việc tuyệt vời là tốt, tuy nhiên, tôi đã phát hiện một vấn đề.
Khi hình ảnh KHÔNG có vòng quay, div # sb-chú thích xuất hiện, như khối trắng nửa trong suốt, kích thước 20x70 pixel (giống như phần đệm) Tôi hiểu rằng bộ đệm của tôi- lên là nguyên nhân của vấn đề.
Tôi tự hỏi liệu có ai có thể giúp tôi với công việc không. Điều gì đó nói với shadowbox KHÔNG HIỂN THỊ # sb-chú thích, nếu rev = "" KHÔNG được chỉ định.
Bất kỳ ai cũng có thể khắc phục vấn đề này.
Có điều gì đó dọc theo những dòng này có thể ??
<script type="text/javascript">
Shadowbox.init({
});
var Shadowbox = window.parent.Shadowbox;
if (getElementById('sb-caption').innerHTML == '')
getElementById('sb-caption').style.display = 'none';
</script>
... Nhưng, điều đó không hiệu quả.