如何在 jQuery 插件中插入图像横幅滑块的链接？

Question

如何在 jQuery 插件中插入图像滑块链接？

我从 http://www.jqueryscript.net/slider/Responsive-jQuery-Full-Width-Image-Slider-Plugin-responsiveSlides.html

获得了滑块源

我试着插入这样的链接：

<a href="www.google.coom"><img src="blablabla.jpg></a>

但是，它不起作用... (T^T) 我重新检查 Chrome（键 F12）

<div class="tgtimg" style="position:absolute !important; height:600px !important; width:100% !important; background:#fff !important; z-index:1 !important; overflow:hidden !important"><img src="http://ikkorea.i.hhosting.kr/main/main_20150710_1.jpg" style="position: absolute; z-index: 1; top: 0px; left: -568.5px; height: 600px; display: block;" class="current"></div>

   <a href="http://search.naver.com/search.naver?sm=tab_hty.top&amp;where=nexearch&amp;ie=utf8&amp;query=%EC%9D%B5%EC%8A%A4%ED%8E%98%EB%94%94%EC%95%84+%EB%8F%84%EC%B0%A9"></a>

我能怎样？

这是我的网站： http://www.istkunst.co.kr/preview/?dgnset_id=5834

Answer 1

改用它，以便 tgtimg class 有一个点击侦听器，它将自动重定向。

$('.tgtimg').click(function(){
      window.location = "url you want";
});

如果您真的很绝望，那是您可以使用的解决方法。

编辑

您可能还想试试 jquery 包裹方法。

$('.tgtimg').children('img').wrap('<a href="www.google.com"></a>');

Answer 2

你可以为你想要点击的所有图片添加一个全局 class，并且为 data-link 中的每个图片添加 link，像这样：

HTML :

<div id="content">
    <img class="img_link" data-link="www.google.com" src="1.jpg">
    <img class="img_link" data-link="www.gmail.com"  src="2.jpg">
    <img class="img_link" data-link="www.yahoo.com"  src="3.jpg">
</div>

创建函数来处理图像点击并重定向到存储在 data-link 中的相关 link，就在 responsiveSlides().

调用之后

JS :

$(function(){

    var p=$('#content').responsiveSlides({
        ....
    });

    //Handling click event and redirecting to the related link
    $('.img_link').click(function(){
        window.location.replace($(this).data('link'));
    });

});

如何在 jQuery 插件中插入图像横幅滑块的链接？

How to insert links to image banner slider in jQuery Plugin?

html

css

jquery

slider