Question

这就是我对jquery的看法

    $(function(){
        $('#slides').slides({
            preload: true,
            preloadImage: 'img/loading.gif',
            play: 5000,
            pause: 2500,
            hoverPause: true
        });
    });

这是我的HTML

    <div id="slides">
   <img height="440" width="384" src="img/example-frame.png" alt="Example Frame" id="frame">
      <div class="slides_container"> 
      <a href="try_events_shamrock_race_green_half.htm"><img src="images/slidephotos/race_slide_photos/GS_slide.png" width="395" height="330" alt="Slide 1" /></a> 
      <img src="images/slidephotos/race_slide_photos/RD_slide.png" width="395" height="330" alt="Slide 2" /> 
      <img src="images/slidephotos/race_slide_photos/VH_slide.png" width="395" height="330" alt="Slide 3" />
       <img src="images/slidephotos/race_slide_photos/FHH_slide.png" width="395" height="330" alt="Slide 4" />
       <img src="images/slidephotos/race_slide_photos/HC_slide.png" width="395" height="330" alt="Slide 5" />
       <img src="images/slidephotos/race_slide_photos/CR_slide.png" width="395" height="330" alt="Slide 6" />
       <img src="images/slidephotos/race_slide_photos/CC_slide.png" width="395" height="330" alt="Slide 7" />
       <img src="images/slidephotos/race_slide_photos/BB_slide.png" width="395" height="330" alt="Slide 8" />

      </div>
    <a href="#" class="prev"><img src="img/arrow-prev.png" width="24" height="43" alt="Arrow Prev" /></a> <a href="#" class="next"><img src="img/arrow-next.png" width="24" height="43" alt="Arrow Next" /></a>


  </div>

你可以在第一张图片上看到我试图让它链接起来，但它不行。任何帮助将不胜感激，谢谢

Answer 1

根据您使用的插件，可能已有内置方法可以执行此操作，但一种选择是将数据属性添加到包含您要链接到的网址的图片中：

<img src="images/slidephotos/race_slide_photos/FHH_slide.png" width="395" height="330" alt="Slide 4" data-link="http://www.yoursite.com" />

然后你会为图像添加一个click事件处理程序，如下所示：

 $(document).on('click', '.slides_container img', function(){
        var url = $(this).data('link');
        if (typeof url !== 'undefined')
        {
            window.location.href = url;
        }
    });

需要在Jquery幻灯片中的图像作为链接

1 个答案: