以下是 jQuery响应式幻灯片特效代码 的示例演示效果:
部分效果截图:
HTML代码(index.html):
<!DOCTYPE html>
<html>
<head>
<title>asdfasdf</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="css/styles.css" />
<link rel="stylesheet" href="css/iview.css" />
<link rel="stylesheet" href="css/skin 1/style.css" />
<script src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/raphael-min.js"></script>
<script type="text/javascript" src="js/jquery.easing.js"></script>
<script src="js/iview.js"></script>
<script>
$(document).ready(function(){
$('#iview').iView({
pauseTime: 7000,
directionNav: false,
controlNav: true,
tooltipY: -15
});
});
</script>
<meta name="keywords" content="JS代码,{keyword},JS广告代码,JS特效代码" />
<meta name="description" content="此代码内容为{title}，属于站长常用代码" />
</head>
<body>
<div id="cont">
<div id="header">
<div class="container">
<h1><a href="#">iView™</a></h1>
<div id="nav">
<ul>
<li class="active"><a href="index.html">Regular</a></li>
<li><a href="index2.html">Multiple</a></li>
<li><a href="index3.html">Regular with API</a></li>
<li><a href="index4.html">Responsive</a></li>
<li><a href="index5.html">Banner</a></li>
</ul>
</div>
</div>
</div>
<div class="container">
<div id="iview">
<div data-iview:image="photos/photo1.jpg" data-iview:transition="slice-top-fade,slice-right-fade">
<div class="iview-caption caption1" data-x="80" data-y="200">iView<sup>™</sup></div>
<div class="iview-caption" data-x="80" data-y="275" data-transition="wipeRight">The world's most awesome jQuery Image & Content Slider</div>
<div class="iview-caption" data-x="254" data-y="320" data-transition="wipeLeft"><i>Presented by <b>Hemn Chawroka</b></i></div>
</div>
<div data-iview:image="photos/photo2.jpg" data-iview:transition="zigzag-drop-top,zigzag-drop-bottom" data-iview:pausetime="3000">
<div class="iview-caption caption5" data-x="60" data-y="280" data-transition="wipeDown">Captions can be positioned and resized freely</div>
<div class="iview-caption caption6" data-x="300" data-y="350" data-transition="wipeUp"><a href="#">Example URL-link</a></div>
</div>
<div data-iview:image="photos/video.jpg" data-iview:type="video" data-iview:transition="strip-right-fade,strip-left-fade">
<iframe src="http://player.vimeo.com/video/11475955?byline=1&portrait=0" width="100%" height="100%" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
<div class="iview-caption caption2" data-x="450" data-y="340" data-transition="wipeRight">Video</div>
<div class="iview-caption caption3" data-x="600" data-y="345" data-transition="wipeLeft">Support</div>
</div>
<div data-iview:image="photos/photo3.jpg">
<div class="iview-caption caption4" data-x="50" data-y="80" data-width="312" data-transition="fade">Some of iView's Options:</div>
<div class="iview-caption blackcaption" data-x="50" data-y="135" data-transition="wipeLeft" data-easing="easeInOutElastic">Touch swipe for iOS and Android devices</div>
<div class="iview-caption blackcaption" data-x="50" data-y="172" data-transition="wipeLeft" data-easing="easeInOutElastic">Image And Thumbs Fully Resizable</div>
<div class="iview-caption blackcaption" data-x="50" data-y="209" data-transition="wipeLeft" data-easing="easeInOutElastic">Customizable Transition Effect</div>
<div class="iview-caption blackcaption" data-x="50" data-y="246" data-transition="wipeLeft" data-easing="easeInOutElastic">Freely Positionable and Stylable Captions</div>
<div class="iview-caption blackcaption" data-x="50" data-y="283" data-transition="wipeLeft" data-easing="easeInOutElastic">Cross Browser Compatibility!</div>
</div>
<div data-iview:image="photos/photo4.jpg">
<div class="iview-caption caption7" data-x="0" data-y="0" data-width="180" data-height="480" data-transition="wipeRight"><h3>The Responsive Caption</h3>This is the product that you <b><i>all have been waiting for</b></i>!<br><br>Customize this slider with just a little HTML and CSS to your very needs. Give each slider some captions to transport your message.<br><br>All in all it works on every browser (including IE6 / 7 / 8) and on iOS and Android devices!</div>
</div>
<div data-iview:image="photos/photo5.jpg">
<div class="iview-caption caption5" data-x="60" data-y="150" data-transition="wipeLeft">What are you waiting for?</div>
<div class="iview-caption caption6" data-x="160" data-y="230" data-transition="wipeRight">Get it Now!</div>
</div>
</div>
</div>
</div>
<div id="background-image">
<img src="img/bckg.jpg" width="1820" height="1024" />
</div>
<script type="text/javascript" src="js/jquery.fullscreen.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#background-image").fullscreenBackground();
});
</script>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-30854466-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</body>
</html>
HTML代码(index2.html):
<!DOCTYPE html>
<html>
<head>
<title>234234</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="css/styles.css" />
<link rel="stylesheet" href="css/iview.css" />
<link rel="stylesheet" href="css/skin 2/style.css" />
<script src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/raphael-min.js"></script>
<script type="text/javascript" src="js/jquery.easing.js"></script>
<script src="js/iview.js"></script>
<script>
$(document).ready(function(){
$('#iview').iView({
pauseTime: 7000,
pauseOnHover: true,
directionNav: true,
directionNavHide: false,
directionNavHoverOpacity: 0,
controlNav: false,
nextLabel: "Nächste",
previousLabel: "Vorherige",
playLabel: "Spielen",
pauseLabel: "Pause",
timer: "360Bar",
timerPadding: 3,
timerColor: "#0F0"
});
$('#iview2').iView({
pauseTime: 7000,
pauseOnHover: true,
directionNav: true,
directionNavHide: false,
controlNav: true,
controlNavNextPrev: false,
controlNavTooltip: false,
nextLabel: "Próximo",
previousLabel: "Anterior",
playLabel: "Jugada",
pauseLabel: "Pausa",
timer: "360Bar",
timerBg: "#EEE",
timerColor: "#000",
timerDiameter: 40,
timerPadding: 4,
timerStroke: 8,
timerPosition: "bottom-right"
});
});
</script>
</head>
<body>
<div id="cont">
<div id="header">
<div class="container">
<h1><a href="#">iView™</a></h1>
<div id="nav">
<ul>
<li><a href="index.html">Regular</a></li>
<li class="active"><a href="index2.html">Multiple</a></li>
<li><a href="index3.html">Regular with API</a></li>
<li><a href="index4.html">Responsive</a></li>
<li><a href="index5.html">Banner</a></li>
</ul>
</div>
</div>
</div>
<div class="container">
<div id="iview">
<div data-iview:image="photos/photo6.jpg">
<div class="iview-caption caption1" data-x="300" data-y="300" data-transition="expandLeft">EASY TO CONFIGURE AND CUSTOMIZE + COMPLETE WITH A CUSTOM API</div>
</div>
<div data-iview:image="photos/photo7.jpg">
<div class="iview-caption video-caption" data-x="50" data-y="50" data-transition="wipeUp"><iframe src="http://player.vimeo.com/video/11475955?byline=1&portrait=0" width="500" height="281" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe></div>
<div class="iview-caption caption4" data-x="600" data-y="140" data-transition="wipeRight">Video</div>
<div class="iview-caption caption5" data-x="740" data-y="145" data-transition="wipeLeft">Support</div>
<div class="iview-caption caption3" data-x="600" data-y="200" data-width="235" data-height="40" data-transition="wipeLeft">You can easily add <b>Vimeo</b> & <b>Youtube Videos</b> to your <b>Slides</b> & <b>Captions</b></div>
</div>
<div data-iview:image="photos/photo8.jpg">
<div class="iview-caption caption2" data-x="300" data-y="300" data-transition="wipeRight">OPTIONAL AUTO-HIDE CONTROLS + OPTIONAL ROLLOVER SLIDESHOW PAUSE</div>
</div>
<div data-iview:image="photos/photo9.jpg">
<div class="iview-caption" data-x="100" data-y="300" data-transition="wipeLeft">A SMOOTH AND SEXY CROSS-BROWSER SLIDER FOR YOUR IMAGES & VIDEOS</div>
</div>
<div data-iview:image="photos/photo10.jpg">
<div class="iview-caption caption3" data-x="100" data-y="300" data-transition="wipeLeft">FEATURING ANIMATED CAPTIONS WITH MANY TRANSITION EFFECTS</div>
</div>
</div>
<div id="iview2">
<div data-iview:image="photos/photo11.jpg">
<div class="iview-caption caption1" data-x="100" data-y="300" data-transition="fade">FINE TUNED, SLEEK & SMOOTH, THIS SLIDER WILL IMPRESS YOUR VISITORS</div>
</div>
<div data-iview:image="photos/photo12.jpg">
<div class="iview-caption caption2" data-x="50" data-y="320" data-transition="wipeRight">SUPPORTS ANIMATED CAPTIONS, VIDEO & IFRAME, SINGLE PAGE MULTI-USE</div>
</div>
<div data-iview:image="photos/photo13.jpg">
<div class="iview-caption caption3" data-x="350" data-y="300" data-transition="wipeLeft">GORGEOUS ANIMATED TIMERS WITH HIGH CUSTOMIZABLE OPTIONS</div>
</div>
<div data-iview:image="photos/photo14.jpg"></div>
</div>
</div>
</div>
<div id="background-image">
<img src="img/bckg.jpg" width="1820" height="1024" />
</div>
<script type="text/javascript" src="js/jquery.fullscreen.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#background-image").fullscreenBackground();
});
</script>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-30854466-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</body>
</html>
JS代码(iview.min.js):
/** * jQuery iView Slider v2.0 * * @version:2.0.1 - August 17,2012 * * @author:Hemn Chawroka * hemn@iprodev.com * http://iprodev.com/ * */
(function(d,v,q){
function y(){
z=v[s](function(){
o.each(function(){
var a=d(this),b=a.width(),c=a.height(),f=d.data(this,u);
if(b!==f.w||c!==f.h)a.trigger(w,[f.w=b,f.h=c])}
);
y()}
,p[A])}
var B=function(a,b){
var c=this;
c.options=b;
c.sliderContent=a;
c.sliderInner=c.sliderContent.html();
c.sliderContent.html("<div class='iviewSlider'>"+c.sliderInner+"</div>");
c.slider=d(".iviewSlider",c.sliderContent);
c.slider.css("position","relative");
c.defs={
slide:0,total:0,image:"",images:[],width:c.sliderContent.width(),height:c.sliderContent.height(),timer:b.timer.toLowerCase(),lock:!1,paused:b.autoAdvance?!1:!0,time:b.pauseTime,easing:b.easing}
;
c.disableSelection(c.slider[0]);
c.slides=c.slider.children();
c.slides.each(function(){
var a=d(this);
c.defs.images.push(a.data("iview:image"));
a.data("iview:thumbnail")&&c.defs.images.push(a.data("iview:thumbnail"));
a.css("display","none");
if("video"==a.data("iview:type")){
var f=a.children().eq(0),e=d('<div class="iview-video-show"><div class="iview-video-container"><a class="iview-video-close" title="'+b.closeLabel+'">˟
</a></div></div>');
a.append(e);
f.appendTo(d("div.iview-video-container",e));
e.css({
width:c.defs.width,height:c.defs.height,top:"-"+c.defs.height+"px"}
).hide();
a.addClass("iview-video").css({
cursor:"pointer"}
)}
c.defs.total++}
).css({
width:c.defs.width,height:c.defs.height}
);
c.sliderContent.append('<div id="iview-preloader"><div></div></div>');
var f=d("#iview-preloader",c.sliderContent),e=d("div",f);
f.css({
top:c.defs.height/2-f.height()/2+"px",left:c.defs.width/2-f.width()/2+"px"}
);
c.sliderContent.append('<div id="iview-timer"><div></div></div>');
c.iviewTimer=d("#iview-timer",c.sliderContent);
c.iviewTimer.hide();
d(".iview-caption",c.slider).each(function(){
var a=d(this);
a.html('<div class="caption-contain">'+a.html()+"</div>")}
);
b.startSlide=b.randomStart?Math.floor(Math.random()*c.defs.total):b.startSlide;
b.startSlide=0<b.startSlide&&b.startSlide>=c.defs.total?c.defs.total-1:b.startSlide;
c.defs.slide=b.startSlide;
c.defs.image=c.slides.eq(c.defs.slide);
c.defs.time=c.defs.image.data("iview:pausetime")?c.defs.image.data("iview:pausetime"):b.pauseTime;
c.defs.easing=c.defs.image.data("iview:easing")?c.defs.image.data("iview:easing"):b.easing;
c.pieDegree=0;
var g=b.timerPadding,k=b.timerDiameter,h=b.timerStroke;
if(1<c.defs.total&&"bar"!=c.defs.timer){
var h="360bar"==c.defs.timer?b.timerStroke:0,i=k+2*g+2*h,j=i,l=Raphael(c.iviewTimer[0],i,j);
c.R=k/2;
var n={
stroke:b.timerBg,"stroke-width":h+2*g}
,D={
stroke:b.timerColor,"stroke-width":h,"stroke-linecap":"round"}
,m={
fill:b.timerColor,stroke:"none","stroke-width":0}
,o={
fill:b.timerBg,stroke:"none","stroke-width":0}
;
l.customAttributes.arc=function(a,b){
var c=1*a,d=(90-c)*Math.PI/180,f=k/2+g+h,e=k/2+g+h,i=f+b*Math.cos(d),d=e-b*Math.sin(d);
return{
path:360==a?[["M",f,e-b],["A",b,b,0,1,1,299.99,e-b]]:[["M",f,e-b],["A",b,b,0,+(180<c),1,i,d]]}
}
;
l.customAttributes.segment=function(a,b){
var c=-90,b=b-1,a=c+a,d=180<a-c,f=k/2+g,e=k/2+g,c=c%360*Math.PI/180,a=a%360*Math.PI/180;
return{
path:[["M",f,e],["l",b*Math.cos(c),b*Math.sin(c)],["A",b,b,0,+d,1,f+b*Math.cos(a),e+b*Math.sin(a)],["z"]]}
}
;
1<c.defs.total&&"pie"==c.defs.timer&&l.circle(c.R+g,c.R+g,c.R+g-1).attr(o);
c.timerBgPath=l.path().attr(n);
c.timerPath=l.path().attr(D);
c.pieTimer=l.path().attr(m)}
c.barTimer=d("div",c.iviewTimer);
1<c.defs.total&&"360bar"==c.defs.timer&&c.timerBgPath.attr({
arc:[359.9,c.R]}
);
"bar"==c.defs.timer?(c.iviewTimer.css({
opacity:b.timerOpacity,width:k,height:h,border:b.timerBarStroke+"px "+b.timerBarStrokeColor+" "+b.timerBarStrokeStyle,padding:g,background:b.timerBg}
),c.barTimer.css({
width:0,height:h,background:b.timerColor,"float":"left"}
)):c.iviewTimer.css({
opacity:b.timerOpacity,width:i,height:j}
);
c.setTimerPosition();
new r(c.defs.images,function(a){
a=a*10;
e.stop().animate({
width:a+"%"}
)}
,function(){
e.stop().animate({
width:"100%"}
,function(){
f.remove();
c.startSlider();
b.onAfterLoad.call(this)}
)}
);
c.sliderContent.bind("swipeleft",function(){
if(c.defs.lock)return false;
c.cleanTimer();
c.goTo("next")}
).bind("swiperight",function(){
if(c.defs.lock)return false;
c.cleanTimer();
c.defs.slide=c.defs.slide-2;
c.goTo("prev")}
);
b.keyboardNav&&d(document).bind("keyup.iView",function(a){
if(a.keyCode=="37"){
if(c.defs.lock)return false;
c.cleanTimer();
c.defs.slide=c.defs.slide-2;
c.goTo("prev")}
if(a.keyCode=="39"){
if(c.defs.lock)return false;
c.cleanTimer();
c.goTo("next")}
}
);
c.iviewTimer.live("click",function(){
c.iviewTimer.hasClass("paused")?c.playSlider():c.stopSlider()}
);
c.sliderContent.bind("iView:pause",function(){
c.stopSlider()}
);
c.sliderContent.bind("iView:play",function(){
c.playSlider()}
);
c.sliderContent.bind("iView:previous",function(){
if(c.defs.lock)return false;
c.cleanTimer();
c.defs.slide=c.defs.slide-2;
c.goTo("prev")}
);
c.sliderContent.bind("iView:next",function(){
if(c.defs.lock)return false;
c.cleanTimer();
c.goTo("next")}
);
c.sliderContent.bind("iView:goSlide",function(a,b){
if(c.defs.lock||c.defs.slide==b||d(this).hasClass("active"))return false;
c.cleanTimer();
c.slider.css("background",'url("'+c.defs.image.data("iview:image")+'") no-repeat');
c.defs.slide=b-1;
c.goTo("control")}
);
c.sliderContent.bind("resize",function(){
t=d(this);
tW=t.width();
tH=t.height();
i=c.slider.width();
j=c.slider.height();
if(c.defs.width!=tW){
var a=tW/i,b=Math.round(c.defs.height*a);
c.slider.css({
"-webkit-transform-origin":"0 0","-moz-transform-origin":"0 0","-o-transform-origin":"0 0","-ms-transform-origin":"0 0","transform-origin":"0 0","-webkit-transform":"scale("+a+")","-moz-transform":"scale("+a+")","-o-transform":"scale("+a+")","-ms-transform":"scale("+a+")",transform:"scale("+a+")"}
);
t.css({
height:b}
);
c.defs.width=tW;
c.setTimerPosition()}
}
);
d(".iview-video",c.slider).click(function(a){
var b=d(this),b=d(".iview-video-show",b);
if(!d(a.target).hasClass("iview-video-close")&&!d(a.target).hasClass("iview-caption")&&!d(a.target).parents().hasClass("iview-caption")){
b.show().animate({
top:0}
,1E3,"easeOutBounce");
c.sliderContent.trigger("iView:pause")}
}
);
d(".iview-video-close",c.slider).click(function(){
var a=d(this).parents(".iview-video-show"),b=d("iframe",a),f=b.attr("src");
b.removeAttr("src").attr("src",f);
a.animate({
top:"-"+c.defs.height+"px"}
,1E3,"easeOutBounce",function(){
a.hide();
c.sliderContent.trigger("iView:play")}
)}
)}
;
B.prototype={
timer:null,startSlider:function(){
var a=this,b=new Image;
b.src=a.slides.eq(0).data("iview:image");
imgWidth=b.width;
imgWidth!=a.defs.width&&(a.defs.width=imgWidth,a.sliderContent.trigger("resize"));
a.iviewTimer.show();
a.slides.eq(a.defs.slide).css("display","block");
a.slider.css("background",'url("'+a.defs.image.data("iview:image")+'") no-repeat');
a.setCaption(a.options);
a.iviewTimer.addClass("paused").attr("title",a.options.playLabel);
a.options.autoAdvance&&1<a.defs.total&&(a.iviewTimer.removeClass("paused").attr("title",a.options.pauseLabel),a.setTimer());
a.options.directionNav&&(a.sliderContent.append('<div class="iview-directionNav"><a class="iview-prevNav" title="'+a.options.previousLabel+'">'+a.options.previousLabel+'</a><a class="iview-nextNav" title="'+a.options.nextLabel+'">'+a.options.nextLabel+"</a></div>"),d(".iview-directionNav",a.sliderContent).css({
opacity:a.options.directionNavHoverOpacity}
),a.sliderContent.hover(function(){
d(".iview-directionNav",a.sliderContent).stop().animate({
opacity:1}
,300)}
,function(){
d(".iview-directionNav",a.sliderContent).stop().animate({
opacity:a.options.directionNavHoverOpacity}
,300)}
),d("a.iview-prevNav",a.sliderContent).live("click",function(){
if(a.defs.lock)return false;
a.cleanTimer();
a.defs.slide=a.defs.slide-2;
a.goTo("prev")}
),d("a.iview-nextNav",a.sliderContent).live("click",function(){
if(a.defs.lock)return false;
a.cleanTimer();
a.goTo("next")}
));
if(a.options.controlNav){
var b='<div class="iview-controlNav">',c="";
!a.options.directionNav&&a.options.controlNavNextPrev&&(b+='<a class="iview-controlPrevNav" title="'+a.options.previousLabel+'">'+a.options.previousLabel+"</a>");
for(var b=b+'<div class="iview-items"><ul>',f=0;
f<a.defs.total;
f++){
var e=a.slides.eq(f),b=b+"<li>";
a.options.controlNavThumbs?(e=e.data("iview:thumbnail")?e.data("iview:thumbnail"):e.data("iview:image"),b+='<a class="iview-control" rel="'+f+'"><img src="'+e+'" /></a>'):(e=e.data("iview:thumbnail")?e.data("iview:thumbnail"):e.data("iview:image"),b+='<a class="iview-control" rel="'+f+'">'+(f+1)+"</a>",a.options.controlNavTooltip&&(c+='<div rel="'+f+'"><img src="'+e+'" /></div>'));
b+="</li>"}
b+="</ul></div>";
!a.options.directionNav&&a.options.controlNavNextPrev&&(b+='<a class="iview-controlNextNav" title="'+a.options.nextLabel+'">'+a.options.nextLabel+"</a>");
b+="</div>";
!a.options.controlNavThumbs&&a.options.controlNavTooltip&&(b+='<div id="iview-tooltip"><div class="holder"><div class="container">'+c+"</div></div></div>");
a.sliderContent.append(b);
d(".iview-controlNav a.iview-control:eq("+a.defs.slide+")",a.sliderContent).addClass("active");
d("a.iview-controlPrevNav",a.sliderContent).live("click",function(){
if(a.defs.lock)return false;
a.cleanTimer();
a.defs.slide=a.defs.slide-2;
a.goTo("prev")}
);
d("a.iview-controlNextNav",a.sliderContent).live("click",function(){
if(a.defs.lock)return false;
a.cleanTimer();
a.goTo("next")}
);
d(".iview-controlNav a.iview-control",a.sliderContent).live("click",function(){
if(a.defs.lock||d(this).hasClass("active"))return false;
a.cleanTimer();
a.slider.css("background",'url("'+a.defs.image.data("iview:image")+'") no-repeat');
a.defs.slide=d(this).attr("rel")-1;
a.goTo("control")}
);
d(".iview-controlNav",a.sliderContent).css({
opacity:a.options.controlNavHoverOpacity}
);
a.sliderContent.hover(function(){
d(".iview-controlNav",a.sliderContent).stop().animate({
opacity:1}
,300);
a.sliderContent.addClass("iview-hover")}
,function(){
d(".iview-controlNav",a.sliderContent).stop().animate({
opacity:a.options.controlNavHoverOpacity}
,300);
a.sliderContent.removeClass("iview-hover")}
);
var g=null;
d(".iview-controlNav a.iview-control",a.sliderContent).hover(function(){
var b=d(this),c=b.attr("rel"),f=d("#iview-tooltip",a.sliderContent),e=d("div.holder",f),l=b.offset().left-a.sliderContent.offset().left-f.outerWidth()/2+a.options.tooltipX,b=b.offset().top-a.sliderContent.offset().top-f.outerHeight()+a.options.tooltipY,n=d("div[rel="+c+"]");
scrollLeft=c*n.width();
f.stop().animate({
left:l,top:b,opacity:1}
,300);
f.not(":visible")&&f.fadeIn(300);
e.stop().animate({
scrollLeft:scrollLeft}
,300);
clearTimeout(g)}
,function(){
var b=d("#iview-tooltip",a.sliderContent);
g=setTimeout(function(){
b.animate({
opacity:0}
,300,function(){
b.hide()}
)}
,200)}
)}
a.sliderContent.bind("mouseover.iView mousemove.iView",function(){
a.options.pauseOnHover&&!a.defs.paused&&a.cleanTimer();
a.sliderContent.addClass("iview-hover")}
).bind("mouseout.iView",function(){
a.options.pauseOnHover&&(!a.defs.paused&&a.timer==null&&a.pieDegree<=359&&a.options.autoAdvance)&&a.setTimer();
a.sliderContent.removeClass("iview-hover")}
)}
,setCaption:function(){
var a=this,b=a.slides.eq(a.defs.slide),c=0;
d(".iview-caption",b).each(function(){
var b=d(this),e=b.data("transition")?d.trim(b.data("transition").toLowerCase()):"fade",g=b.data("speed")?b.data("speed"):a.options.captionSpeed,k=b.data("easing")?b.data("easing"):a.options.captionEasing,h="undefined"!=b.data("x")?b.data("x"):"center",i="undefined"!=b.data("y")?b.data("y"):"center",j=b.data("width")?b.data("width"):b.width(),l=b.data("height")?b.data("height"):b.height(),n=b.outerWidth(),o=b.outerHeight();
"center"==h&&(h=a.defs.width/2-n/2);
"center"==i&&(i=a.defs.height/2-o/2);
var m=d(".caption-contain",b);
b.css({
opacity:0}
);
m.css({
opacity:0,position:"relative",width:j,height:l}
);
switch(e){
case "wipedown":b.css({
top:i-l,left:h}
);
m.css({
top:l+3*l,left:0}
);
break;
case "wipeup":b.css({
top:i+l,left:h}
);
m.css({
top:l-3*l,left:0}
);
break;
case "wiperight":b.css({
top:i,left:h-j}
);
m.css({
top:0,left:j+2*j}
);
break;
case "wipeleft":b.css({
top:i,left:h+j}
);
m.css({
top:0,left:j-2*j}
);
break;
case "fade":b.css({
top:i,left:h}
);
m.css({
top:0,left:0}
);
break;
case "expanddown":b.css({
top:i,left:h,height:0}
);
m.css({
top:l+3*l,left:0}
);
break;
case "expandup":b.css({
top:i+l,left:h,height:0}
);
m.css({
top:l-3*l,left:0}
);
break;
case "expandright":b.css({
top:i,left:h,width:0}
);
m.css({
top:0,left:j+2*j}
);
break;
case "expandleft":b.css({
top:i,left:h+j,width:0}
),m.css({
top:0,left:j-2*j}
)}
setTimeout(function(){
b.animate({
opacity:a.options.captionOpacity,top:i,left:h,width:j,height:l}
,g,k,function(){
}
)}
,c);
setTimeout(function(){
m.animate({
opacity:a.options.captionOpacity,top:0,left:0}
,g,k)}
,c+100);
c+=250}
)}
,processTimer:function(){
if("360bar"==this.defs.timer){
var a=0==this.pieDegree?0:this.pieDegree+0.9;
this.timerPath.attr({
arc:[a,this.R]}
)}
else"pie"==this.defs.timer?(a=0==this.pieDegree?0:this.pieDegree+0.9,this.pieTimer.attr({
segment:[a,this.R]}
)):this.barTimer.css({
width:100*(this.pieDegree/360)+"%"}
);
this.pieDegree+=3}
,transitionEnd:function(a){
a.options.onAfterChange.call(this);
a.defs.lock=!1;
a.slides.css("display","none");
a.slides.eq(a.defs.slide).show();
a.slider.css("background",'url("'+a.defs.image.data("iview:image")+'") no-repeat');
d(".iview-strip,.iview-block",a.slider).remove();
a.defs.time=a.defs.image.data("iview:pausetime")?a.defs.image.data("iview:pausetime"):a.options.pauseTime;
a.iviewTimer.animate({
opacity:a.options.timerOpacity}
);
a.pieDegree=0;
a.processTimer();
a.setCaption(a.options);
null==a.timer&&!a.defs.paused&&(a.timer=setInterval(function(){
a.timerCall(a)}
,a.defs.time/120))}
,addStrips:function(a,b){
for(var b=b?b:this.options,c=0;
c<b.strips;
c++){
var f=Math.round(this.slider.width()/b.strips),e=Math.round(this.slider.height()/b.strips),g="-"+(f+c*f-f)+"px 0%",k=a?e*c+"px":"0px",h=a?"0px":f*c+"px";
a&&(g="0% -"+(e+c*e-e)+"px");
c==b.strips-1?(f=a?"0px":this.slider.width()-f*c+"px",e=a?this.slider.height()-e*c+"px":"0px"):(f=a?"0px":f+"px",e=a?e+"px":"0px");
g=d('<div class="iview-strip"></div>').css({
width:f,height:e,top:k,left:h,background:'url("'+this.defs.image.data("iview:image")+'") no-repeat '+g,opacity:0}
);
this.slider.append(g)}
}
,addBlocks:function(){
for(var a=Math.round(this.slider.width()/this.options.blockCols),b=Math.round(this.slider.height()/this.options.blockRows),c=0;
c<this.options.blockRows;
c++)for(var f=0;
f<this.options.blockCols;
f++){
var e="-"+(a+f*a-a)+"px -"+(b+c*b-b)+"px";
f==this.options.blockCols-1&&this.slider.width();
e=d('<div class="iview-block"></div>').css({
width:a+"px",height:b+"px",top:c*b+"px",left:f*a+"px",background:'url("'+this.defs.image.data("iview:image")+'") no-repeat '+e,opacity:0}
);
this.slider.append(e)}
}
,runTransition:function(a){
var b=this;
switch(a){
case "strip-up-right":case "strip-up-left":b.addStrips();
var c=0,f=0,e=d(".iview-strip",b.slider);
"strip-up-left"==a&&(e=d(".iview-strip",b.slider).reverse());
e.each(function(){
var a=d(this);
a.css({
top:"",bottom:"0px"}
);
setTimeout(function(){
a.animate({
height:"100%",opacity:"1.0"}
,b.options.animationSpeed,b.defs.easing,function(){
f==b.options.strips-1&&b.transitionEnd(b);
f++}
)}
,100+c);
c+=50}
);
break;
case "strip-down":case "strip-down-right":case "strip-down-left":b.addStrips();
var f=c=0,e=d(".iview-strip",b.slider);
"strip-down-left"==a&&(e=d(".iview-strip",b.slider).reverse());
e.each(function(){
var a=d(this);
a.css({
bottom:"",top:"0px"}
);
setTimeout(function(){
a.animate({
height:"100%",opacity:"1.0"}
,b.options.animationSpeed,b.defs.easing,function(){
f==b.options.strips-1&&b.transitionEnd(b);
f++}
)}
,100+c);
c+=50}
);
break;
case "strip-left-right":case "strip-left-right-up":case "strip-left-right-down":b.addStrips(!0);
var g=f=c=0,e=d(".iview-strip",b.slider);
"strip-left-right-down"==a&&(e=d(".iview-strip",b.slider).reverse());
e.each(function(){
var a=d(this);
0==f?(a.css({
right:"",left:"0px"}
),f++):(a.css({
left:"",right:"0px"}
),f=0);
setTimeout(function(){
a.animate({
width:"100%",opacity:"1.0"}
,b.options.animationSpeed,b.defs.easing,function(){
g==b.options.strips-1&&b.transitionEnd(b);
g++}
)}
,100+c);
c+=50}
);
break;
case "strip-up-down":case "strip-up-down-right":case "strip-up-down-left":b.addStrips();
g=f=c=0;
e=d(".iview-strip",b.slider);
"strip-up-down-left"==a&&(e=d(".iview-strip",b.slider).reverse());
e.each(function(){
var a=d(this);
0==f?(a.css({
bottom:"",top:"0px"}
),f++):(a.css({
top:"",bottom:"0px"}
),f=0);
setTimeout(function(){
a.animate({
height:"100%",opacity:"1.0"}
,b.options.animationSpeed,b.defs.easing,function(){
g==b.options.strips-1&&b.transitionEnd(b);
g++}
)}
,100+c);
c+=50}
);
break;
case "left-curtain":case "right-curtain":case "top-curtain":case "bottom-curtain":"left-curtain"==a||"right-curtain"==a?b.addStrips():b.addStrips(!0);
f=c=0;
e=d(".iview-strip",b.slider);
if("right-curtain"==a||"bottom-curtain"==a)e=d(".iview-strip",b.slider).reverse();
e.each(function(){
var e=d(this),g=e.width(),h=e.height();
"left-curtain"==a||"right-curtain"==a?e.css({
top:"0px",height:"100%",width:"0px"}
):e.css({
left:"0px",height:"0px",width:"100%"}
);
setTimeout(function(){
"left-curtain"==a||"right-curtain"==a?e.animate({
width:g,opacity:"1.0"}
,b.options.animationSpeed,b.defs.easing,function(){
f==b.options.strips-1&&b.transitionEnd(b);
f++}
):e.animate({
height:h,opacity:"1.0"}
,b.options.animationSpeed,b.defs.easing,function(){
f==b.options.strips-1&&b.transitionEnd(b);
f++}
)}
,100+c);
c+=50}
);
break;
case "strip-up-right":case "strip-up-left":b.addStrips();
f=c=0;
e=d(".iview-strip",b.slider);
"strip-up-left"==a&&(e=d(".iview-strip",b.slider).reverse());
e.each(function(){
var a=d(this);
a.css({
bottom:"0px"}
);
setTimeout(function(){
a.animate({
height:"100%",opacity:"1.0"}
,b.options.animationSpeed,b.defs.easing,function(){
f==b.options.strips-1&&b.transitionEnd(b);
f++}
)}
,100+c);
c+=50}
);
break;
case "strip-left-fade":case "strip-right-fade":case "strip-top-fade":case "strip-bottom-fade":"strip-left-fade"==a||"strip-right-fade"==a?b.addStrips():b.addStrips(!0);
f=c=0;
e=d(".iview-strip",b.slider);
if("strip-right-fade"==a||"strip-bottom-fade"==a)e=d(".iview-strip",b.slider).reverse();
e.each(function(){
var e=d(this),g=e.width(),h=e.height();
"strip-left-fade"==a||"strip-right-fade"==a?e.css({
top:"0px",height:"100%",width:g}
):e.css({
left:"0px",height:h,width:"100%"}
);
setTimeout(function(){
e.animate({
opacity:"1.0"}
,1.7*b.options.animationSpeed,b.defs.easing,function(){
f==b.options.strips-1&&b.transitionEnd(b);
f++}
)}
,100+c);
c+=35}
);
break;
case "slide-in-up":case "slide-in-down":opts={
strips:1}
;
b.addStrips(!1,opts);
var e=d(".iview-strip:first",b.slider),k=0,k="slide-in-up"==a?"-"+b.defs.height+"px":b.defs.height+"px";
e.css({
top:k,height:"100%",width:b.defs.width}
);
e.animate({
top:"0px",opacity:1}
,2*b.options.animationSpeed,b.defs.easing,function(){
b.transitionEnd(b)}
);
break;
case "zigzag-top":case "zigzag-bottom":case "zigzag-grow-top":case "zigzag-grow-bottom":case "zigzag-drop-top":case "zigzag-drop-bottom":b.addBlocks();
for(var h=b.options.blockCols*b.options.blockRows,c=0,i=[],e=d(".iview-block",b.slider),j=0;
j<b.options.blockRows;
j++){
var k=j*b.options.blockCols,l=(j+1)*b.options.blockCols;
if(1==j%2)for(var n=l-1;
n>=k;
n--)i.push(d(e[n]));
else for(n=k;
n<l;
n++)i.push(d(e[n]))}
("zigzag-bottom"==a||"zigzag-grow-bottom"==a||"zigzag-drop-bottom"==a)&&i.reverse();
e.each(function(e){
var f=d(i[e]),g=f.height(),j=f.width(),k=f.css("top");
"zigzag-grow-top"==a||"zigzag-grow-bottom"==a?f.width(0).height(0):("zigzag-drop-top"==a||"zigzag-drop-bottom"==a)&&f.css({
top:"-=50"}
);
setTimeout(function(){
"zigzag-grow-top"==a||"zigzag-grow-bottom"==a?f.animate({
opacity:"1",height:g,width:j}
,b.options.animationSpeed,b.defs.easing,function(){
e==h-1&&b.transitionEnd(b)}
):"zigzag-drop-top"==a||"zigzag-drop-bottom"==a?f.animate({
top:k,opacity:"1"}
,b.options.animationSpeed,b.defs.easing,function(){
e==h-1&&b.transitionEnd(b)}
):f.animate({
opacity:"1"}
,2*b.options.animationSpeed,"easeInOutExpo",function(){
e==h-1&&b.transitionEnd(b)}
)}
,100+c);
c+=20}
);
break;
case "block-fade":case "block-fade-reverse":case "block-expand":case "block-expand-reverse":b.addBlocks();
var h=b.options.blockCols*b.options.blockRows,o=c=f=0,m=0,i=[];
i[o]=[];
e=d(".iview-block",b.slider);
if("block-fade-reverse"==a||"block-expand-reverse"==a)e=d(".iview-block",b.slider).reverse();
e.each(function(){
i[o][m]=d(this);
m++;
m==b.options.blockCols&&(o++,m=0,i[o]=[])}
);
for(n=0;
n<2*b.options.blockCols;
n++){
for(var p=n,j=0;
j<b.options.blockRows;
j++)0<=p&&p<b.options.blockCols&&function(){
var e=d(i[j][p]),g=e.width(),k=e.height();
("block-expand"==a||"block-expand-reverse"==a)&&e.width(0).height(0);
setTimeout(function(){
e.animate({
opacity:"1",width:g,height:k}
,b.options.animationSpeed/1.3,b.defs.easing,function(){
f==h-1&&b.transitionEnd(b);
f++}
)}
,100+c)}
(),p--;
c+=100}
break;
case "block-random":case "block-expand-random":case "block-drop-random":b.addBlocks();
h=b.options.blockCols*b.options.blockRows;
c=0;
e=b.shuffle(d(".iview-block",b.slider));
e.each(function(e){
var f=d(this),g=f.height(),k=f.width(),i=f.css("top");
"block-expand-random"==a&&f.width(0).height(0);
"block-drop-random"==a&&f.css({
top:"-=50"}
);
setTimeout(function(){
f.animate({
top:i,opacity:"1",height:g,width:k}
,b.options.animationSpeed,b.defs.easing,function(){
e==h-1&&b.transitionEnd(b)}
)}
,100+c);
c+=20}
);
break;
default:opts={
strips:1}
,b.addStrips(!1,opts),e=d(".iview-strip:first",b.slider),e.css({
height:"100%",width:b.defs.width}
),"slide-in-right"==a?e.css({
height:"100%",width:b.defs.width,left:b.defs.width+"px",right:""}
):"slide-in-left"==a&&e.css({
left:"-"+b.defs.width+"px"}
),e.animate({
left:"0px",opacity:1}
,2*b.options.animationSpeed,b.defs.easing,function(){
b.transitionEnd(b)}
)}
}
,shuffle:function(a){
for(var a=a.slice(),b=a.length,c=b;
c--;
){
var d=parseInt(Math.random()*b),e=a[c];
a[c]=a[d];
a[d]=e}
return a}
,timerCall:function(a){
a.processTimer();
360<=a.pieDegree&&(a.cleanTimer(),a.goTo(!1))}
,setTimer:function(){
var a=this;
a.timer=setInterval(function(){
a.timerCall(a)}
,a.defs.time/120)}
,cleanTimer:function(){
clearInterval(this.timer);
this.timer=null}
,goTo:function(a){
this.defs&&this.defs.slide==this.defs.total-1&&this.options.onLastSlide.call(this);
this.cleanTimer();
this.iviewTimer.animate({
opacity:0}
);
this.options.onBeforeChange.call(this);
a?("prev"==a||"next"==a)&&this.slider.css("background",'url("'+this.defs.image.data("iview:image")+'") no-repeat'):this.slider.css("background",'url("'+this.defs.image.data("iview:image")+'") no-repeat');
this.defs.slide++;
this.defs.slide==this.defs.total&&(this.defs.slide=0,this.options.onSlideShowEnd.call(this));
0>this.defs.slide&&(this.defs.slide=this.defs.total-1);
this.defs.image=this.slides.eq(this.defs.slide);
this.options.controlNav&&(d(".iview-controlNav a.iview-control",this.sliderContent).removeClass("active"),d(".iview-controlNav a.iview-control:eq("+this.defs.slide+")",this.sliderContent).addClass("active"));
a=this.options.fx;
"random"==this.options.fx.toLowerCase()&&(a="left-curtain right-curtain top-curtain bottom-curtain strip-down-right strip-down-left strip-up-right strip-up-left strip-up-down strip-up-down-left strip-left-right strip-left-right-down slide-in-right slide-in-left slide-in-up slide-in-down fade block-random block-fade block-fade-reverse block-expand block-expand-reverse block-expand-random zigzag-top zigzag-bottom zigzag-grow-top zigzag-grow-bottom zigzag-drop-top zigzag-drop-bottom strip-left-fade strip-right-fade strip-top-fade strip-bottom-fade block-drop-random".split(" "),a=a[Math.floor(Math.random()*(a.length+1))],a==q&&(a="fade"),a=d.trim(a.toLowerCase()));
-1!=this.options.fx.indexOf(",")&&(a=this.options.fx.split(","),a=a[Math.floor(Math.random()*a.length)],a==q&&(a="fade"),a=d.trim(a.toLowerCase()));
this.defs.image.data("iview:transition")&&(a=this.defs.image.data("iview:transition").split(","),a=a[Math.floor(Math.random()*a.length)],a=d.trim(a.toLowerCase()));
this.defs.easing=this.defs.image.data("iview:easing")?this.defs.image.data("iview:easing"):this.options.easing;
this.defs.lock=!0;
this.runTransition(a)}
,playSlider:function(){
null==this.timer&&this.defs.paused&&(this.iviewTimer.removeClass("paused").attr("title",this.options.pauseLabel),this.setTimer(),this.defs.paused=!1,this.options.onPlay.call(this))}
,stopSlider:function(){
this.iviewTimer.addClass("paused").attr("title",this.options.playLabel);
this.cleanTimer();
this.defs.paused=!0;
this.options.onPause.call(this)}
,setTimerPosition:function(){
for(var a=this.options.timerPosition.toLowerCase().split("-"),b=0;
b<a.length;
b++)"top"==a[b]?this.iviewTimer.css({
top:this.options.timerY+"px",bottom:""}
):"middle"==a[b]?this.iviewTimer.css({
top:this.options.timerY+this.defs.height/2-this.options.timerDiameter/2+"px",bottom:""}
):"bottom"==a[b]?this.iviewTimer.css({
bottom:this.options.timerY+"px",top:""}
):"left"==a[b]?this.iviewTimer.css({
left:this.options.timerX+"px",right:""}
):"center"==a[b]?this.iviewTimer.css({
left:this.options.timerX+this.defs.width/2-this.options.timerDiameter/2+"px",right:""}
):"right"==a[b]&&this.iviewTimer.css({
right:this.options.timerX+"px",left:""}
)}
,disableSelection:function(a){
"undefined"!=typeof a.onselectstart?a.onselectstart=function(){
return!1}
:"undefined"!=typeof a.style.MozUserSelect?a.style.MozUserSelect="none":"undefined"!=typeof a.style.webkitUserSelect?a.style.webkitUserSelect="none":"undefined"!=typeof a.style.userSelect?a.style.userSelect="none":a.onmousedown=function(){
return!1}
;
a.unselectable="on"}
,isTouch:function(){
return!!("ontouchstart"in v)}
}
;
var r=function(a,b,c){
this.m_pfnPercent=b;
this.m_pfnFinished=c;
this.m_nProcessed=this.m_nLoaded=0;
this.m_aImages=[];
this.m_nICount=a.length;
for(b=0;
b<a.length;
b++)this.Preload(a[b])}
;
r.prototype={
Preload:function(a){
var b=new Image;
this.m_aImages.push(b);
b.onload=r.prototype.OnLoad;
b.onerror=r.prototype.OnError;
b.onabort=r.prototype.OnAbort;
b.oImagePreload=this;
b.bLoaded=!1;
b.source=a;
b.src=a}
,OnComplete:function(){
this.m_nProcessed++;
this.m_nProcessed==this.m_nICount?this.m_pfnFinished():this.m_pfnPercent(Math.round(10*(this.m_nProcessed/this.m_nICount)))}
,OnLoad:function(){
this.bLoaded=!0;
this.oImagePreload.m_nLoaded++;
this.oImagePreload.OnComplete()}
,OnError:function(){
this.bError=!0;
this.oImagePreload.OnComplete()}
,OnAbort:function(){
this.bAbort=!0;
this.oImagePreload.OnComplete()}
}
;
d.fn.iView=function(a){
a=jQuery.extend({
fx:"random",easing:"easeOutQuad",strips:20,blockCols:10,blockRows:5,animationSpeed:500,pauseTime:5E3,startSlide:0,directionNav:!0,directionNavHoverOpacity:0.6,controlNav:!1,controlNavNextPrev:!0,controlNavHoverOpacity:0.6,controlNavThumbs:!1,controlNavTooltip:!0,captionSpeed:500,captionEasing:"easeInOutSine",captionOpacity:1,autoAdvance:!0,keyboardNav:!0,touchNav:!0,pauseOnHover:!1,nextLabel:"Next",previousLabel:"Previous",playLabel:"Play",pauseLabel:"Pause",closeLabel:"Close",randomStart:!1,timer:"Pie",timerBg:"#000",timerColor:"#EEE",timerOpacity:0.5,timerDiameter:30,timerPadding:4,timerStroke:3,timerBarStroke:1,timerBarStrokeColor:"#EEE",timerBarStrokeStyle:"solid",timerPosition:"top-right",timerX:10,timerY:10,tooltipX:5,tooltipY:-5,onBeforeChange:function(){
}
,onAfterChange:function(){
}
,onAfterLoad:function(){
}
,onLastSlide:function(){
}
,onSlideShowEnd:function(){
}
,onPause:function(){
}
,onPlay:function(){
}
}
,a);
d(this).each(function(){
var b=d(this);
new B(b,a)}
)}
;
d.fn.reverse=[].reverse;
var o=d([]),p=d.resize=d.extend(d.resize,{
}
),z,s="setTimeout",w="resize",u=w+"-special-event",A="delay";
p[A]=250;
p.throttleWindow=!0;
d.event.special[w]={
setup:function(){
if(!p.throttleWindow&&this[s])return!1;
var a=d(this);
o=o.add(a);
d.data(this,u,{
w:a.width(),h:a.height()}
);
1===o.length&&y()}
,teardown:function(){
if(!p.throttleWindow&&this[s])return!1;
var a=d(this);
o=o.not(a);
a.removeData(u);
o.length||clearTimeout(z)}
,add:function(a){
function b(a,b,g){
var k=d(this),h=d.data(this,u);
h.w=b!==q?b:k.width();
h.h=g!==q?g:k.height();
c.apply(this,arguments)}
if(!p.throttleWindow&&this[s])return!1;
var c;
if(d.isFunction(a))return c=a,b;
c=a.handler;
a.handler=b}
}
;
var x=!!("ontouchstart"in v),E=x?"touchstart":"mousedown",F=x?"touchend":"mouseup",C=x?"touchmove":"mousemove";
d.event.special.swipe={
scrollSupressionThreshold:10,durationThreshold:1E3,horizontalDistanceThreshold:30,verticalDistanceThreshold:75,setup:function(){
var a=d(this);
a.bind(E,function(b){
function c(a){
if(e){
var b=a.originalEvent.touches?a.originalEvent.touches[0]:a;
g={
time:(new Date).getTime(),coords:[b.pageX,b.pageY]}
;
Math.abs(e.coords[0]-g.coords[0])>d.event.special.swipe.scrollSupressionThreshold&&a.preventDefault()}
}
var f=b.originalEvent.touches?b.originalEvent.touches[0]:b,e={
time:(new Date).getTime(),coords:[f.pageX,f.pageY],origin:d(b.target)}
,g;
a.bind(C,c).one(F,function(){
a.unbind(C,c);
e&&g&&g.time-e.time<d.event.special.swipe.durationThreshold&&(Math.abs(e.coords[0]-g.coords[0])>d.event.special.swipe.horizontalDistanceThreshold&&Math.abs(e.coords[1]-g.coords[1])<d.event.special.swipe.verticalDistanceThreshold)&&e.origin.trigger("swipe").trigger(e.coords[0]>g.coords[0]?"swipeleft":"swiperight");
e=g=q}
)}
)}
}
;
d.each({
swipeleft:"swipe",swiperight:"swipe"}
,function(a,b){
d.event.special[a]={
setup:function(){
d(this).bind(b,d.noop)}
}
}
)}
)(jQuery,this);
CSS代码(iview.css):
/* The slider */
.iviewSlider{overflow:hidden;}
/* The timer in the Slider */
#iview-timer{position:absolute;z-index:100;border-radius:5px;cursor:pointer;}
#iview-timer div{border-radius:3px;}
/* The Preloader in the Slider */
#iview-preloader{position:absolute;z-index:1000;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;border:#000 1px solid;padding:1px;width:100px;height:3px;}
#iview-preloader div{float:left;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;height:3px;background:#000;width:0px;}
/* The strips and boxes in the Slider */
.iview-strip{display:block;position:absolute;z-index:5;}
.iview-block{display:block;position:absolute;z-index:5;}
/* Direction nav styles (e.g. Next & Prev) */
.iview-directionNav a{position:absolute;top:45%;z-index:9;cursor:pointer;}
.iview-prevNav{left:0px;}
.iview-nextNav{right:0px;}
/* Control nav styles (e.g. 1,2,3...) */
.iview-controlNav{position:absolute;z-index:9;}
.iview-controlNav a{z-index:9;cursor:pointer;}
.iview-controlNav a.active{font-weight:bold;}
.iview-controlNav .iview-items ul{list-style:none;}
.iview-controlNav .iview-items ul li{display:inline;position:relative;}
.iview-controlNav .iview-tooltip{position:absolute;}
/* The captions in the Slider */
.iview-caption{position:absolute;z-index:4;overflow:hidden;cursor:default;}
/* The video show in the Slider */
.iview-video-show{background:#000;position:absolute;width:100%;height:100%;z-index:101;}
.iview-video-show .iview-video-container{position:relative;width:100%;height:100%;}
.iview-video-show .iview-video-container a.iview-video-close{position:absolute;right:10px;top:10px;background:#222;color:#FFF;height:20px;width:20px;text-align:center;line-height:29px;font-size:22px;font-weight:bold;overflow:hidden;-webkit-border-radius:15px;-moz-border-radius:15px;border-radius:15px;}
.iview-video-show .iview-video-container a.iview-video-close:hover{background:#444;}
CSS代码(styles.css):
@import url('http://fonts.googleapis.com/css?family=Ubuntu:regular,italic,bold,bolditalic&subset=cyrillic,greek,latin');@import url('reset.css');*{padding:0px;margin:0px;font-family:'Ubuntu',Tahoma;line-height:100%;outline:none;}
html{border:0px;}
body{color:#FFF;font-size:9pt;cursor:default;}
.clear{clear:both;padding:0px;margin:0px;height:0px;}
a{text-decoration:none;cursor:pointer;color:#d0d9de;}
a:hover{color:#FFF;}
#cont{width:100%;height:100%;overflow:hidden;position:absolute;top:0;left:0;z-index:70;overflow:auto;}
.copy{text-shadow:#111 1px 1px 0px;text-align:center;padding:10px 0px;line-height:150%;}
.copy p{line-height:150%;}
/* ======================================================== Top bar ===================================================== */
#header{z-index:10000;height:37px;line-height:37px;padding-bottom:2px;color:#ddd;text-shadow:0 -1px black;background:url(../img/topbar.png) repeat-x;margin-bottom:20px;}
#header .container{width:1004px;margin-left:auto;margin-right:auto;}
#header a{line-height:36px;}
#header ul{list-style:none;}
#header h1{float:left;font-size:16px;}
#header h1,#header h1 a{color:#eee;}
#header h1 a{display:block;text-decoration:none;}
#header h1 a:hover{color:#fff;}
#header #nav{float:right;border-left:1px solid #2f4b56;border-left:1px solid rgba(255,255,255,0.05);border-right:1px solid #111;}
#header #nav li{float:left;}
#header #nav a{height:36px;display:block;padding:0 15px;color:#d0d9de;border-left:1px solid #191919;border-right:1px solid #2f4b56;border-right:1px solid rgba(255,255,255,0.05);text-decoration:none;cursor:pointer;}
#header #nav a:hover{background:url(../img/topbar-hover.png);}
#header #nav a img{float:left;margin-right:12px;margin-top:11px;}
#header #nav li.active a,#header #nav a:active{background:url(../img/topbar-active.png);border-right:0;padding-right:16px;}
#header #nav span{display:inline-block;vertical-align:text-top;line-height:16px;font-size:11px;padding:0 5px;color:#fff;text-shadow:0 1px #902a27;border-radius:2px;margin-left:10px;background-color:#e93631;background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#f65d5f),color-stop(100%,#e93631));background-image:-webkit-linear-gradient(top,#f65d5f,#e93631);background-image:-moz-linear-gradient(top,#f65d5f,#e93631);background-image:-ms-linear-gradient(top,#f65d5f,#e93631);background-image:-o-linear-gradient(top,#f65d5f,#e93631);background-image:linear-gradient(top,#f65d5f,#e93631);-webkit-box-shadow:inset 0 1px rgba(255,255,255,0.2),0 1px rgba(0,0,0,0.2);-moz-box-shadow:inset 0 1px rgba(255,255,255,0.2),0 1px rgba(0,0,0,0.2);box-shadow:inset 0 1px rgba(255,255,255,0.2),0 1px rgba(0,0,0,0.2);}
div.header div img#logo{float:left;}
sup{font-size:13px;}
分享到QQ
分享到微博
微信扫一扫
