You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
130 lines
2.3 KiB
130 lines
2.3 KiB
$(function(){
|
|
var $slides = $('.slide_pics li');
|
|
var len = $slides.length;
|
|
var nowli = 0;
|
|
var prevli = 0;
|
|
var $prev = $('.prev');
|
|
var $next = $('.next');
|
|
var ismove = false;
|
|
var timer = null;
|
|
$slides.not(':first').css({left:760});
|
|
$slides.each(function(index, el) {
|
|
var $li = $('<li>');
|
|
|
|
if(index==0)
|
|
{
|
|
$li.addClass('active');
|
|
}
|
|
|
|
$li.appendTo($('.points'));
|
|
});
|
|
$points = $('.points li');
|
|
timer = setInterval(autoplay,4000);
|
|
|
|
$('.slide').mouseenter(function() {
|
|
clearInterval(timer);
|
|
});
|
|
|
|
$('.slide').mouseleave(function() {
|
|
timer = setInterval(autoplay,4000);
|
|
});
|
|
|
|
function autoplay(){
|
|
nowli++;
|
|
move();
|
|
$points.eq(nowli).addClass('active').siblings().removeClass('active');
|
|
}
|
|
|
|
$points.click(function(event) {
|
|
if(ismove)
|
|
{
|
|
return;
|
|
}
|
|
nowli = $(this).index();
|
|
|
|
if(nowli==prevli)
|
|
{
|
|
return;
|
|
}
|
|
|
|
$(this).addClass('active').siblings().removeClass('active');
|
|
move();
|
|
|
|
});
|
|
|
|
$prev.click(function() {
|
|
if(ismove)
|
|
{
|
|
return;
|
|
}
|
|
nowli--;
|
|
move();
|
|
$points.eq(nowli).addClass('active').siblings().removeClass('active');
|
|
|
|
});
|
|
|
|
$next.click(function() {
|
|
if(ismove)
|
|
{
|
|
return;
|
|
}
|
|
nowli++;
|
|
move();
|
|
$points.eq(nowli).addClass('active').siblings().removeClass('active');
|
|
|
|
});
|
|
|
|
|
|
function move(){
|
|
|
|
ismove = true;
|
|
|
|
if(nowli<0)
|
|
{
|
|
nowli=len-1;
|
|
prevli = 0
|
|
$slides.eq(nowli).css({left:-760});
|
|
$slides.eq(nowli).animate({left:0},800,'easeOutExpo');
|
|
$slides.eq(prevli).animate({left:760},800,'easeOutExpo',function(){
|
|
ismove = false;
|
|
});
|
|
prevli=nowli;
|
|
return;
|
|
}
|
|
|
|
if(nowli>len-1)
|
|
{
|
|
nowli = 0;
|
|
prevli = len-1;
|
|
$slides.eq(nowli).css({left:760});
|
|
$slides.eq(nowli).animate({left:0},800,'easeOutExpo');
|
|
$slides.eq(prevli).animate({left:-760},800,'easeOutExpo',function(){
|
|
ismove = false;
|
|
});
|
|
prevli=nowli;
|
|
return;
|
|
}
|
|
|
|
|
|
if(prevli<nowli)
|
|
{
|
|
$slides.eq(nowli).css({left:760});
|
|
$slides.eq(prevli).animate({left:-760},800,'easeOutExpo');
|
|
$slides.eq(nowli).animate({left:0},800,'easeOutExpo',function(){
|
|
ismove = false;
|
|
});
|
|
prevli=nowli;
|
|
|
|
}
|
|
else
|
|
{
|
|
$slides.eq(nowli).css({left:-760});
|
|
$slides.eq(prevli).animate({left:760},800,'easeOutExpo');
|
|
$slides.eq(nowli).animate({left:0},800,'easeOutExpo',function(){
|
|
ismove = false;
|
|
});
|
|
prevli=nowli;
|
|
}
|
|
|
|
}
|
|
}) |