jQuery标签TAB控制图片切换代码

分类: 图片相关
时间: 2018-03-01 21:54:28
编辑: 墨倾天下
浏览: 1771

下载次数：7 文件大小：85.86KB 所需积分：0 QQ联系购买积分：3331653644（1元=10积分）

HTML代码

<div class="m-slide" style="margin:30px auto">
  <ul class="img" style="position: relative; width: 490px; height: 200px;">
    <li style="position: absolute; width: 490px; left: 0px; top: 0px; display: list-item;"> <a href="#" target="_blank"><img src="images/1.jpg"></a></li>
    <li style="position: absolute; width: 490px; left: 0px; top: 0px; display: none;"> <a href="#" target="_blank"><img src="images/2.jpg"></a></li>
    <li style="position: absolute; width: 490px; left: 0px; top: 0px; display: none;"> <a href="#" target="_blank"><img src="images/3.jpg"></a></li>
    <li style="position: absolute; width: 490px; left: 0px; top: 0px; display: none;"> <a href="#" target="_blank"><img src="images/4.jpg"></a></li>
  </ul>
  <ul class="tab">
    <li class="  on"><a href="#"><b></b> <span class="title">Picture info 1 </span></a> </li>
    <li><a href="#"><b></b><span class="title">Picture info 2 </span></a></li>
    <li class=" "><a href="#"><b></b><span class="title"> Picture info 3 </span></a></li>
    <li class=" "><a href="#"><b></b><span class="title"> Picture info 4 </span></a></li>
  </ul>
 </div>

JS代码

jQuery(".m-slide").slide({ titCell:".tab li", mainCell:".img",effect:"fold", autoPlay:true});

标签:

jquery 焦点图图片切换