jquery.fn.loadimage=function(scaling,obj){ var n = obj.length; return this.each(function(){ var $t = $(this); var src = $(this).attr("data-img"); var img = new image(); img.src = src; //处理ff下会自动读取缓存图片 if(img.complete || img.width){ n -- ; if(n == 0){ banner(); } return; } $(img).load(function(){ $t.attr("style","background:url("+src+") no-repeat center"); n -- ; if(n == 0){ banner(); } }); }); } function banner(){ //初始化banner样式 $(".banner").css("background","none"); var listn = $(".banner > ul > li").length; $(".banner > ul > li").eq(0).fadein(1000); $(".banner > ul > li").eq(0).addclass("active") for(i=0;i'); } $(".banner .btn").css("margin-left",-$(".btn").width()/2); $(".banner .btn span").eq(0).addclass("on"); var video=document.getelementbyid("video-3"); //执行效果 var sw = 0; myshow(sw); $(".banner .btn span").mouseover(function(){ sw = $(".banner .btn span").index(this); myshow(sw); }); $(window).resize(function() { myshow(sw); }); function myshow(i){ $(".banner .btn span").eq(i).addclass("on").siblings("span").removeclass("on"); $(".banner > ul > li").eq(i).stop(true,true).fadein(1000).siblings().stop(true,true).fadeout(1000); $(".banner > ul > li").eq(i).stop(true,true).addclass("active").siblings().stop(true,true).removeclass("active"); var width=$(document).innerwidth(); if(width>= 768 && $(".banner > ul > li").eq(0).hasclass("active")){ video.play(); }else{ video.pause(); video.currenttime = 0; } } //滑入停止动画,滑出开始动画 $(".banner").hover(function(){ if(mytime){ clearinterval(mytime); } },function(){ clearinterval(mytime); mytime = setinterval(function(){ myshow(sw); sw++; if(sw==listn){sw=0;} } , 5000); }); //自动开始 var mytime = setinterval(function(){ myshow(sw); sw++; if(sw==listn){sw=0;} } , 5000); } var os = function() { var ua = navigator.useragent, iswindowsphone = /(?:windows phone)/.test(ua), issymbian = /(?:symbianos)/.test(ua) || iswindowsphone, isandroid = /(?:android)/.test(ua), isfirefox = /(?:firefox)/.test(ua), ischrome = /(?:chrome|crios)/.test(ua), istablet = /(?:ipad|playbook)/.test(ua) || (isandroid && !/(?:mobile)/.test(ua)) || (isfirefox && /(?:tablet)/.test(ua)), isphone = /(?:iphone)/.test(ua) && !istablet, ispc = !isphone && !isandroid && !issymbian; return { istablet: istablet, isphone: isphone, isandroid: isandroid, ispc: ispc }; }(); $(function(){ // $(".banner > ul > li").loadimage(true,$(".banner > ul > li")); })