Плагин jQuery Exposure: несколько галерей - PullRequest
Новая
       1

Плагин jQuery Exposure: несколько галерей

0 голосов
/ 23 февраля 2011

У меня проблемы с размещением двух отдельных галерей на одной странице.Одна галерея выглядит нормально при загрузке экрана (первое изображение, большие пальцы и стрелки влево / вправо).Однако во второй галерее отображаются только стрелки влево / вправо.Когда я нажимаю на любую из стрелок (из первой или второй галереи), она очищает изображение, но большие пальцы и стрелки все еще там.Иногда щелкая стрелки, он застревает на gif-изображении загрузчика, и изображение не появляется.Я использую jQuery Exposure Plugin demo 4. Что я здесь не так делаю? 

<div id="main"><div id="exposure"></div><div class="clear"></div></div>
<div class="panel">
<div id="left"><a href="javascript:void(0);" onclick="$.exposure.prevImage();return true;"><img src="Exposure/left.png" alt="Previous" /></a></div>
    <ul id="images">
        <li><a href="photo1.jpg"><img src="photo1.jpg" /></a></li>
        <li><a href="photo2.jpg"><img src="photo2.jpg" /></a></li>
          </ul>
          <div id="right"><a href="javascript:void(0);" onclick="$.exposure.nextImage();return true;"><img src="right.png" alt="Next" /></a></div>
        </div>

<div id="main"><div id="exposure"></div><div class="clear"></div></div>
<div class="panel">
<div id="left"><a href="javascript:void(0);" onclick="$.exposure.prevImage();return true;"><img src="Exposure/left.png" alt="Previous" /></a></div>
    <ul id="images">
        <li><a href="photo3.jpg"><img src="photo3.jpg" /></a></li>
        <li><a href="photo4.jpg"><img src="photo4.jpg" /></a></li>
          </ul>
          <div id="right"><a href="javascript:void(0);" onclick="$.exposure.nextImage();return true;"><img src="right.png" alt="Next" /></a></div>
        </div>

jQuery: 

<script type="text/javascript">
    $(function(){
        $('#images').exposure({target : '#exposure'});
        $('#images2').exposure({target : '#exposure2'});
});

1 Ответ

0 голосов
/ 23 февраля 2011

Сначала исправьте дубликаты id атрибутов.Каждый атрибут id должен быть уникальным на странице, дубликаты атрибутов id могут вызвать все виды странного и запутанного поведения.

В вашем случае у вас есть два элемента <div id="exposure">, но ваша вторая галерея выглядитfor <div id="exposure2">: 

$('#images2').exposure({target : '#exposure2'});

Ваша вторая галерея пытается связать себя с тем, чего не существует, в то время как ваша первая галерея: 

$('#images').exposure({target : '#exposure'});

пытается связать себя с двумя разными<div> с одинаковыми id.

...