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.
243 lines
7.6 KiB
243 lines
7.6 KiB
;(function($){
|
|
$.fn.carousel = function(param){
|
|
var carousel = param.carousel,//轮播框架
|
|
indexContainer = param.indexContainer,//下标框架
|
|
list = $(carousel).children("li"),//轮播内容
|
|
len = list.length,//轮播内容数量
|
|
prev = param.prev,//上翻按钮
|
|
next = param.next,//下翻按钮
|
|
timing = param.timing,//自动轮播间隔时间
|
|
animateTime = param.animateTime,//动画时间
|
|
autoPlay = param.autoPlay,//自动播放 true/false
|
|
timer,//定时器
|
|
index = 1,//索引值
|
|
indexList,//下标列表
|
|
main_bg = ".carousel_bg"
|
|
indexClassName = "active",//下标高亮类名
|
|
action = true,//开始滚动 true/false
|
|
totalWidtn = list.width()*(list.length+2),//轮播框架总宽度
|
|
direction = param.direction;//滚动方向
|
|
|
|
/*初始化*/
|
|
for(var i = 1;i <= list.length;i++){
|
|
$(indexContainer).append("<li></li>")
|
|
}
|
|
$(carousel).width(totalWidtn)
|
|
.append($(list[0]).clone())
|
|
.prepend($(list[list.length-1]).clone())
|
|
.css("left","-"+list.width()+"px");
|
|
list = $(carousel).children("li");
|
|
indexList = $(indexContainer).children("li");
|
|
$(indexList[index-1]).addClass(indexClassName);
|
|
$(".carousel_bg_"+index).show();
|
|
|
|
/*判断是否自动播放*/
|
|
if (autoPlay) {
|
|
startTiming();
|
|
$(carousel+","+prev+","+next+","+indexContainer).hover(function(){
|
|
window.clearInterval(timer);
|
|
},function(){
|
|
startTiming();
|
|
});
|
|
}
|
|
|
|
/*计时方法*/
|
|
function startTiming(){
|
|
/*判断方向*/
|
|
switch (direction) {
|
|
case "right" :
|
|
timer = window.setInterval("$.rightChangeImg();",timing);
|
|
break;
|
|
case "left" :
|
|
timer = window.setInterval("$.leftChangeImg();",timing);
|
|
break;
|
|
default:
|
|
timer = window.setInterval("$.leftChangeImg();",timing);
|
|
}
|
|
};
|
|
|
|
/*切换高亮下标*/
|
|
$.extend({changeIndex:function(index){
|
|
$(indexList).removeClass(indexClassName);
|
|
$(indexList[index]).addClass(indexClassName);
|
|
var src = $(".carousel li").eq(index+1).find("img").attr("src");
|
|
var i = index + 1;
|
|
$(".carousel_bg").fadeOut(animateTime);
|
|
$(".carousel_bg_"+i).fadeIn(animateTime);
|
|
}});
|
|
|
|
|
|
/*向左切换图片*/
|
|
$.extend({leftChangeImg:function(){
|
|
action = false;
|
|
if (index==len) {
|
|
index = 0;
|
|
$(carousel).stop(true,true).css("left","0px");
|
|
}
|
|
index++;
|
|
$(carousel).stop(true,true).animate({
|
|
left : "-="+list.width()+"px"
|
|
},animateTime);
|
|
setTimeout(function(){
|
|
if (index==len) {
|
|
index = 0;
|
|
$(carousel).stop(true,true).css("left","0px");
|
|
}
|
|
action = true;
|
|
},animateTime);
|
|
$.changeIndex(index-1);
|
|
}});
|
|
|
|
/*向右切换图片*/
|
|
$.extend({rightChangeImg:function(){
|
|
action = false;
|
|
if (index==0) {
|
|
index = len;
|
|
$(carousel).stop(true,true).css("left","-"+left+"px");
|
|
}
|
|
index--;
|
|
var left = totalWidtn-list.width()*2;
|
|
$(carousel).stop(true,true).animate({
|
|
left : "+="+list.width()+"px"
|
|
},animateTime);
|
|
setTimeout(function(){
|
|
if (index==0) {
|
|
index = len;
|
|
$(carousel).stop(true,true).css("left","-"+left+"px");
|
|
}
|
|
action = true;
|
|
},animateTime);
|
|
if (index == 0) {
|
|
$.changeIndex(len-1);
|
|
}else{
|
|
$.changeIndex(index-1);
|
|
}
|
|
}});
|
|
|
|
/*下翻点击处理*/
|
|
$(next).on("click",function(){
|
|
var nowLeft = Math.abs(parseInt($(carousel).css("left")));
|
|
var left = totalWidtn-list.width()*2;
|
|
if (action) {
|
|
if (nowLeft == left) {
|
|
index = 0;
|
|
$(carousel).stop(true,true).css("left","0px");
|
|
}
|
|
$.leftChangeImg();
|
|
}
|
|
});
|
|
|
|
/*上翻点击处理*/
|
|
$(prev).on("click",function(){
|
|
var nowLeft = Math.abs(parseInt($(carousel).css("left")));
|
|
var left = totalWidtn-list.width()*2;
|
|
if (action) {
|
|
if (nowLeft == 0) {
|
|
index = len;
|
|
$(carousel).stop(true,true).css("left","-"+left+"px");
|
|
}
|
|
$.rightChangeImg();
|
|
}
|
|
});
|
|
|
|
/*下标点击处理*/
|
|
indexList.on("click",function(){
|
|
var no = $(this).index()+1;
|
|
if (action) {
|
|
if (no > index) {
|
|
$.changeIndex(no-1);
|
|
action = false;
|
|
var left = (no - index)*list.width();
|
|
index = no;
|
|
$(carousel).stop(true,true).animate({
|
|
left : "-="+left+"px"
|
|
},animateTime);
|
|
setTimeout(function(){
|
|
action = true;
|
|
},animateTime);
|
|
}else if (no < index) {
|
|
$.changeIndex(no-1);
|
|
action = false;
|
|
var left = (index - no)*list.width();
|
|
index = no;
|
|
$(carousel).stop(true,true).animate({
|
|
left : "+="+left+"px"
|
|
},animateTime);
|
|
setTimeout(function(){
|
|
action = true;
|
|
},animateTime);
|
|
}
|
|
|
|
}
|
|
});
|
|
}
|
|
})(jQuery);
|
|
|
|
|
|
/*///////////////////////////////////////////////////////////////////*/
|
|
|
|
$(document).ready(function() {
|
|
var page_num = $("#rumor_cen .rumor_list").length;
|
|
var py_index = 0;
|
|
$(".py_button").click(function() {
|
|
var pre = $(this).hasClass("py_pre");
|
|
$(".py_cen").fadeOut(500);
|
|
$(".juanzhou").animate({
|
|
width: "70px"
|
|
}, 500, "swing", function() {
|
|
$(".py_cen").fadeIn(300);
|
|
if(pre) {
|
|
if(py_index > 0) {
|
|
py_index -= 1;
|
|
} else {
|
|
py_index = page_num - 1;
|
|
}
|
|
var title = $("#rumor_cen .rumor_list").eq(py_index).find(".title").html();
|
|
var tips = $("#rumor_cen .rumor_list").eq(py_index).find(".tips").html();
|
|
var aside = $("#rumor_cen .rumor_list").eq(py_index).find(".aside").html();
|
|
$(".py_cen h2").html(title);
|
|
$(".py_cen p").html(tips);
|
|
$(".py_cen .img").html(aside);
|
|
} else {
|
|
if(py_index < page_num - 1) {
|
|
py_index += 1;
|
|
} else {
|
|
py_index = 0;
|
|
}
|
|
var title = $("#rumor_cen .rumor_list").eq(py_index).find(".title").html();
|
|
var tips = $("#rumor_cen .rumor_list").eq(py_index).find(".tips").html();
|
|
var aside = $("#rumor_cen .rumor_list").eq(py_index).find(".aside").html();
|
|
$(".py_cen h2").html(title);
|
|
$(".py_cen p").html(tips);
|
|
$(".py_cen .img").html(aside);
|
|
}
|
|
$(".juanzhou").animate({
|
|
width: "718px"
|
|
}, 300, "swing");
|
|
});
|
|
return false;
|
|
});
|
|
$(".slide01").carousel({
|
|
carousel: ".carousel", //轮播图容器
|
|
indexContainer: ".img-index", //下标容器
|
|
prev: ".carousel-prev", //左按钮
|
|
next: ".carousel-next", //右按钮
|
|
timing: 3000, //自动播放间隔
|
|
animateTime: 700, //动画时间
|
|
autoPlay: true, //是否自动播放 true/false
|
|
direction: "left", //滚动方向 right/left
|
|
});
|
|
|
|
$(document)
|
|
.on('mouseenter mouseleave', '._mainNavMore', function (e) {
|
|
var $list = $(this).find('._moreList');
|
|
|
|
if (e.type == 'mouseenter') {
|
|
$list.show();
|
|
} else {
|
|
$list.hide();
|
|
}
|
|
});
|
|
});
|
|
|
|
|