//翻页
//html代码
<div class="calendar-real">
<img src="">
<img src="">
<img src="">
<img src="">
</div>
//jauery代码
var $carouselNum = $('.calendar-real')
k = 0,
t = 0;
//减去最后一屏显示的图片数量
var len = $carouselNum.children().length-1;
//上一张按钮
$pre.on('click', function(e) {
if( j > 0) {
j--;
$carouselNum.animate({marginLeft: '-'+ 404*j}, 800);//404为图片的宽度
if(j == 0) {
$(this).addClass('pre-before-btn').removeClass('pre-after-btn');//第一张图片,则上一张按钮禁止点击
$(this).css('cursor','default');//不再是小手样式
}else {
$next.addClass('next-before-btn').removeClass('next-after-btn');//下一张按钮可点击,
$next.css('cursor','pointer');小手样式
}
}
});
//下一张按钮
$next.on('click', function(e) {
e.preventDefault();
if(j < len){
j++;
$carouselNum.animate({marginLeft: '-'+ 404*j},800);
k =j;
if(j > 0) {
$pre.addClass('pre-after-btn').removeClass('pre-bafore-btn');//可点击
$pre.css('cursor','pointer');
}
if(j == len) {
$next.addClass('next-after-btn').removeClass('next-before-btn');//最后一张,不可点击
$(this).css('cursor','default');
}
}
});