jquery图片轮播效果代码

来源:互联网 发布:js控制a标签显示隐藏 编辑:程序博客网 时间:2024/05/22 17:02
slides.js
$(function(){/*banner切换开始*/            var imgsetting = {                left: ".tunele",//左                right: ".tuneri",//右                Img: ".banner_a>a",//图片                Label: ".tunece>a",//标签                IsAutomatic: true,//是否自动切换                time: 1000, //时间时间                length: 0,                index: 0,                setTimeout: null            }            var imgmethods = {                left: function (obj) {                    imgsetting.index -= 1;                    if (imgsetting.index < 0) imgsetting.index = imgsetting.length;                    imgmethods.method(obj);                },                right: function (obj) {                    imgsetting.index += 1;                    if (imgsetting.index > imgsetting.length) imgsetting.index = 0;                    imgmethods.method(obj);                },                method: function (obj) {                    jQuery("div.banner").css("background", jQuery(imgsetting.Img, obj).eq(imgsetting.index).attr("bkcolor"));                    jQuery(imgsetting.Img, obj).hide().eq(imgsetting.index).show();                    jQuery(".cur", obj).removeClass("cur");                    jQuery(imgsetting.Label, obj).eq(imgsetting.index).addClass("cur");                }            }            $.fn.ImgSwitch = function (obj) {                imgsetting.length = jQuery(imgsetting.Img, this).length - 1;                jQuery.extend(imgsetting, obj);                if (imgsetting.length < 1) return;                var $this = this;                if (imgsetting.IsAutomatic) {                    imgsetting.setTimeout = setInterval(function () { imgmethods.right($this) }, imgsetting.time);                }                jQuery(imgsetting.left).click(function () { imgmethods.left($this) })                jQuery(imgsetting.right).click(function () { imgmethods.right($this) })                jQuery(imgsetting.Label, $this).click(function () {                    imgsetting.index = jQuery(this).index();                    imgmethods.method($this);                    clearInterval(imgsetting.setTimeout);                    imgsetting.setTimeout = setInterval(function () { imgmethods.right($this) }, imgsetting.time);                });                $this.hover(function () { jQuery(imgsetting.left).show(); jQuery(imgsetting.right).show(); clearInterval(imgsetting.setTimeout); }, function () { jQuery(imgsetting.left).hide(); jQuery(imgsetting.right).hide(); imgsetting.setTimeout = setInterval(function () { imgmethods.right($this) }, imgsetting.time); })            }            $("div.banner").ImgSwitch();            /*banner切换结束*/})



<c:if test="${advertInfoList.size() > 0}">       <div class="banner">           <div class="banner_a"> <c:forEach items="${advertInfoList}" var="results" varStatus="index" begin="0" step="1">  <c:choose>             <c:when test="${index.index == 0}">             <c:if test="${results.isActivity == 2}">             <a class="banner${index.index + 1}" style="background:url(${results.bannerPath}) no-repeat top center;cursor:default;" ></a>             </c:if>             <c:if test="${results.isActivity == 0}">             <a class="banner${index.index + 1}" href="${results.bannerLink}" style="background:url(${results.bannerPath}) no-repeat top center;" target="_blank"></a>             </c:if>                          </c:when>             <c:otherwise>             <c:if test="${results.isActivity == 2}">             <a class="banner${index.index + 1}" style="background:url(${results.bannerPath}) no-repeat top center;display:none;cursor:default;" ></a>             </c:if>             <c:if test="${results.isActivity == 0}">             <a class="banner${index.index + 1}" href="${results.bannerLink}" style="background:url(${results.bannerPath}) no-repeat top center;display:none;" target="_blank"></a>             </c:if>                            </c:otherwise>         </c:choose>  </c:forEach>       </div>  <div class="swit">          <a href="javascript:void(0)" class="swit_l tunele" ></a>          <a href="javascript:void(0)" class="swit_r tuneri"></a>          <div class="Toggle_button tunece">          <c:if test="${advertInfoList.size() > 0}"> <c:forEach items="${advertInfoList}" var="results" varStatus="index" begin="0" step="1">  <c:choose>             <c:when test="${index.index == 0}">              <a href="javascript:void(0);" class="cur">1</a>             </c:when>             <c:otherwise>               <a href="javascript:void(0);">${index.index + 1}</a>              </c:otherwise>         </c:choose>  </c:forEach> </c:if>                       </div>      </div>   </div></c:if> 




0 0
原创粉丝点击