Лайтбокс Nivo добавляет теги к изображению, чтобы сделать их фреймами

У меня есть сайт, на котором я внедряю Nivo Lightbox (документация может быть найден здесь). Я добавил теги css и script, и, похоже, все работало нормально, но когда я протестировал его, я заметил, что некоторые изображения были оставлены по ширине, а не по центру. Когда я изучил код, который подтягивался в ползунке, он сказал, что содержимое ползунка было

<iframe src="/images/sized/images/uploads/_DSC0413-333x500.JPG" class="nivo-lightbox-item" frameborder="0" vspace="0" hspace="0" scrolling="auto"></iframe>

тогда как обычные изображения использовали этот тег

<img class="mfp-img" src="http://www.hoekstraspecialty.com/images/photo_gallery/copy_1_sprinter9.jpg" style="max-height: 535px;">

без iframe.

Я добавляю изображения в лайтбокс через блог в ExpressionEngine. Код для ввода изображений и привязки их к лайтбоксу:

{exp:weblog:entries weblog="gallery_images" url_title="shelving" limit="1" disable="member_data|trackbacks|pagination|categories"}
    <p style="text-align: right;">
        {equip_gallery limit="1"}<a href="{img}" class="shelving" data-lightbox-gallery="gallery1"><img class="shelving"  alt="" src="{site_url}images/uploads/button_shelving_17.jpg" style="width: 228px; height: 29px;"></a>{/equip_gallery}
        <div id="gallery" style="display:none;">
            {if equip_gallery}
                {equip_gallery}
                    <a href="{exp:imgsizer:size src="{img}" height="500" justurl="yes" }" class="shelving"  data-lightbox-gallery="gallery1"><img class="small" src="{img}" title="{caption}"></a>
                {/equip_gallery}
            {/if}
        </div>
    </p>
{/exp:weblog:entries}

Все изображения должны быть добавлены в одном формате, и когда я смотрю на теги изображений не в лайтбоксе, все они выглядят одинаково, поэтому я не уверен, почему некоторые из них помещаются в iframe, а некоторые нет. .

Чтобы увидеть пример, нажмите на ссылку выше и нажмите «Галерея стеллажей». Первое изображение работает правильно и отформатировано тегом img. Последнее изображение (щелкните стрелку влево) неправильно отформатировано тегом iframe.


jquery lightbox nivo-slider
person lucky.hooligan    schedule 13.11.2013    source источник

Ответы (2)


arrow_upward
1
arrow_downward

В вашем примере расширение вашего изображения указано в верхнем регистре. Nivo Lightbox проверяет только строчные буквы.

Изменить if(s.match(/\.(jpeg|jpg|gif|png)$/)!=null)

в if(s.match(/\.(jpeg|JPEG|jpg|JPG|gif|GIF|png|PNG)$/)!=null)

person HappyFace133    schedule 18.12.2013

arrow_upward
0
arrow_downward

Используя скрипт, который я использовал, я не мог контролировать тип содержимого, отображаемого лайтбоксом (это контролировалось кодом лайтбокса). Из-за этого я переключился на другой лайтбокс, где я мог контролировать тип контента. Это устранило проблему, с которой я столкнулся, хотя я до сих пор не уверен, почему исходный лайтбокс считывал некоторые изображения как фреймы.

person lucky.hooligan    schedule 15.11.2013