Добавление ссылки на изображение разбивает слайдер jquery, помогите пожалуйста!

Question

Я работаю над сайтом для друга и пытаюсь добавить ссылку на каждое изображение в слайд-шоу. В слайд-шоу используется jquery и скрипт easySlider1.7.js. Все работает отлично, если изображения остаются в одиночестве, но когда я пытаюсь обернуть изображения ссылкой, слайды больше не продвигаются так, как должны. Вот живой сайт, который отображает проблему ...

http://www.splits59.com/

Вот HTML-код для каждого из изображений слайд ...

<div class="covercontent2box"> 
<div class="covercontent2"> 
<div id="slideshow"> 
<a href="/ashton-jacket-p-107.html"><img src="img/homepagesummer2010_2.2-cut.jpg" class="active" /></a> 
<a href="/carly-coverup-p-106.html"><img src="img/homepagesummer2010_3.2-cut.jpg" /></a> 
<a href="/shop-online-bottoms-c-15_14.html"><img src="img/homepagesummer2010_1.2-cut.jpg" /></a> 
</div> 
</div> 
</div> 

А вот код JQuery на страница, которая контролирует ползунок ...

<script type="text/javascript"> 
function slideSwitch() { 
    var $active = $('#slideshow IMG.active'); 

    if ($active.length == 0) $active = $('#slideshow IMG:last'); 

    // use this to pull the images in the order they appear in the markup 
    var $next = $active.next().length ? $active.next() 
     : $('#slideshow IMG:first'); 

    $active.addClass('last-active'); 

    $next.css({opacity: 0.0}) 
     .addClass('active') 
     .animate({opacity: 1.0}, 1000, function() { 
      $active.removeClass('active last-active'); 
     }); 
} 

$(function() { 
    setInterval("slideSwitch()", 4500); 
}); 
    </script> 

кто-нибудь есть какие-либо идеи, почему добавление ссылок тега к изображениям ломает ползунок? Любая помощь или направление, которые будут предоставлены, будут оценены.

Спасибо,

Девин

Answer 1

Пример код markupSlider очень специфичен в инструкции о том, как это должно выглядеть: http://cssglobe.com/lab/easyslider1.7/js/easySlider1.7.js:

/* 
* markup example for $("#slider").easySlider(); 
* 
* <div id="slider"> 
*  <ul> 
*   <li><img src="images/01.jpg" alt="" /></li> 
*   <li><img src="images/02.jpg" alt="" /></li> 
*   <li><img src="images/03.jpg" alt="" /></li> 
*   <li><img src="images/04.jpg" alt="" /></li> 
*   <li><img src="images/05.jpg" alt="" /></li> 
*  </ul> 
* </div> 
* 
*/ 

Try следуя инструкции. Я думаю, что структура кода важна для его работы.

Answer 2

Вы можете разместить весь HTML-страницу? Я думаю, что это сделано, потому что функция jquery slideSwitch() работает только с тегом img, но не на якоре. так что если вы будете писать всю html-страницу, то я могу попробовать.