javascript - カスタム JavaScript 画像スワップへのリンクを追加するにはどうすればよいですか?

Question

私はスライドショーと呼んでいるdivを持っています

<div id="slideshow">
<img src="images/imageslider/Pic1.jpg" style="width:270px;" alt="" />
<img src="images/imageslider/Pic2.jpg" style="width:270px;" alt="" />
<img src="images/imageslider/Pic3.jpg" style="width:270px;" alt="" />
</div>

ここに私の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()", 6000 );
});

何が起こっているかというと、私が変わるときです

<img src="images/imageslider/Pic1.jpg" style="width:270px;" alt="" />

に

<a href="http://google.com"><img src="images/imageslider/Pic1.jpg" style="width:270px;" alt="" /></a>

このスクリプトにより、関数の動作が不安定になります。リンクで次の写真にフェードインする代わりに、事前定義された順序ではなくジャンプします。