javascript - 添加图像链接会破坏 jquery slider ,请帮忙!

标签 javascript jquery html

我正在为一个 friend 开发一个网站,并试图为幻灯片放映中的每张图片添加一个链接。幻灯片放映使用 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>

这是页面上控制 slider 的 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>

有谁知道为什么向图像添加链接标签会破坏 slider ?提供的任何帮助或指导将不胜感激。

谢谢,

德文

最佳答案

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>
 *
 */

尝试按照说明进行操作。我预计,代码的结构对于使其正常工作很重要。

关于javascript - 添加图像链接会破坏 jquery slider ,请帮忙!,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2786069/

相关文章:

javascript - 使用 karma-webpack 时找不到模块错误

jquery - 无法将类 dragme 元素置于水平滚动中

javascript - 如何在水平窗口调整大小时缩小网页的边距?

javascript - 如何在 JavaScript 中运行一个操作恰好 x 秒?

javascript - 为什么在 Coffeescript 中创建 AngularJS Controller 时使用 @ 符号?

jquery - 高度让这个子导航在第一次点击时向上滑动

javascript - 使用 jQuery 平滑地过渡滚动图像

asp.net - 如何去除 <a> 生成的图像周围的边框?

javascript - 围绕圆画小线的数学

javascript - JavaScript 中的基本时间和日期操作