JQuery Lightbox 0,5 дает ошибку для скрытых ссылок. Как это исправить? - PullRequest
Новая
       2

JQuery Lightbox 0,5 дает ошибку для скрытых ссылок. Как это исправить?

0 голосов
/ 02 мая 2011

Я использую jquery-lightbox-0.5 http://leandrovieira.com/projects/jquery/lightbox/ Звоню вот так 

$('.zoomLightbox a').lightBox();

HTML 

<p class="zoomLightbox">
<a rel="lightbox" class="zoomPhoto" title="abc" href="images/products/lightbox-zoom-placeholder.gif">View larger photo</a>
<a style="display: none;" rel="lightbox" class="zoomPhoto hide" title="abc" href="images/products/lightbox-zoom-placeholder.gif">View larger photo</a>
...
</p>

За исключением первой ссылки остальные скрыты.Теперь проблема в том, что при переходе ко второму img, а затем обратно к первой предыдущей ссылке все еще активна и при нажатии на предыдущую ссылку она выдает эту ошибку. 

settings.imageArray[settings.activeImage] is undefined
[Break On This Error] objImagePreloader.src = settings.imageArray[settings.activeImage][0];

Я застрял здесь, любая помощь приветствуется.

Его происходит только при фиксированной навигации: true

Ответы [ 3 ]

1 голос
/ 30 мая 2011

Я думаю, вы должны изменить плагин

Перейти к строке 194 

objImagePreloader.src = settings.imageArray[settings.activeImage][0]

изменить на 

if (settings.imageArray[settings.activeImage]) {
                objImagePreloader.src = settings.imageArray[settings.activeImage][0];
            }
            else {
                _finish();
                return false;
            }

Надеюсь, эта помощь!

0 голосов
/ 02 мая 2011

Я думаю, что у вас отсутствуют <img /> теги.Согласно документации плагина, ваша разметка должна выглядеть следующим образом: 

<p class="zoomLightbox">
<a rel="lightbox" class="zoomPhoto">
  <img title="abc" src="images/products/lightbox-zoom-placeholder.gif" />
  View larger photo
</a>
<a style="display: none;" rel="lightbox" class="zoomPhoto hide" >
  <img title="abc" src="images/products/lightbox-zoom-placeholder.gif" />
  View larger photo
</a>
...
</p>

Edit : я понял, что <img> s не являются обязательными для плагина.Пожалуйста, подождите, пока я обновлю этот ответ.

0 голосов
/ 02 мая 2011

Посмотрите эту запись и прочитайте комментарии, добавленные в конце.

:: UPDATE :: Чувак, я реализовал пример на основе вашегоприведенный пример кода, и он отлично работает на моем конце ....

HTML-код: 

<%@page contentType="text/html" pageEncoding="UTF-8"%>

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">

    <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
            <title>JSP Page</title>
            <script type="text/javascript" src="jquery-1.5.2.js"></script>
            <script type="text/javascript" src="jquery.lightbox-0.5.js"></script>
            <link rel="stylesheet" type="text/css" href="jquery.lightbox-0.5.css" media="screen" />
            <script type="text/javascript">
                $(document).ready(function() {
                    $('.zoomLightbox a').lightBox();
                });
            </script>
        </head>
        <body>
            <p class="zoomLightbox">
                <a rel="lightbox" class="zoomPhoto" title="abc" href="img_1.png">View larger photo</a>
                <a style="display: none;" rel="lightbox" class="zoomPhoto hide" title="abc" href="img_2.png">View larger photo</a>
            </p>
        </body>
    </html>

И следующая структура проекта:

enter image description here

Просто перепроверьте свой код с приведенным выше и убедитесь, что вы правильно включили необходимые файлы js и css ...

...