Question

怎么给iView-jquery的图片加入链接?

首先附上代码:
<div id="iview" style="height:365px">

<div data-iview:thumbnail="/themes/default/image/index/xbsx.jpg" data-iview:image="/themes/default/image/index/xbsx.jpg">
</div>

<div data-iview:thumbnail="/themes/default/image/index/yumi.jpg" data-iview:image="/themes/default/image/index/yumi.jpg">
<div class="iview-caption caption4" data-x="50" data-y="80" data-transition="fade">免费赠送,全城疯抢</div>
</div>

<div data-iview:thumbnail="/themes/default/image/index/yumi.jpg" data-iview:image="/themes/default/image/index/nvren.jpg">
<div class="iview-caption blackcaption" data-x="50" data-y="135" data-transition="wipeLeft" data-easing="easeInOutElastic">新鲜，安全，美味，15分绿色生活</div>
</div>

<div data-iview:thumbnail="/themes/default/image/index/yumi.jpg" data-iview:image="/themes/default/image/index/munv.jpg">
<div class="iview-caption " data-x="250" data-y="240" data-transition="wipeRight">妈妈所关心的，正是我们所在乎的！</div>
</div>

</div>
显示出来的效果是下面那样的...但没有链接..只能单纯的展示图片..我想给这些图片都加上链接..应该怎么写才对?

Answer 1

这个插件里的图片不是通过img标签显示的，所以就没法加链接。
可以给<div data-iview......加个click事件，跳转到相应链接就可以了。
给你代码参考：
var url1 = 'http://www.baidu.com',
url2 = 'http://www.google.com',
url3 = 'http://www.163.com';

$('.iviewSlider').children().each(function(){
$(this).click(function(){
switch ($(this).attr('data-iview:image'))
{
case 'photos/photo1.jpg':
window.location.href=url1;
break;
case 'photos/photo2.jpg':
window.location.href=url1;
break;
case 'photos/photo3.jpg':
window.location.href=url1;
break;
}
});
});
我是在官网demo上测试的，可用。
有问题给我留言讨论，ps：你的网址发上来会更好

追问

直接加到这代码上方吗?

追答

用$(document).ready( )把这段代码包裹起来，放在任何位置。
把你网址给我，我帮你看下。