//动态设置轮播图背景图片代码
$(".imgBox li").width($(window).width()); //将li的宽度设置为屏幕的宽度
$(".imgBox>li").each(function(){
imgURL="url(img/0"+String($(this).index()+1)+".png)";
$(this).css("background",imgURL+"center center no-repeat");
})
//轮播效果实现代码
var imgWidth=$(".imgBox li").eq(0).width();
var imgCount=$(".imgBox li").length; //获取轮播图片的张数
var imgIndex=0;
function showImg(imgIndex){
$(".imgBox").animate({left:-imgWidth*imgIndex});
$(".imgNav").find("li").eq(imgIndex).addClass("focus").siblings().removeClass("focus");
}
$(".next").stop(true,true).click(function(){
imgIndex++;
if(imgIndex==imgCount){imgIndex=0;}
showImg(imgIndex);
})
$(".prev").stop(true,true).click(function(){
imgIndex--;
if(imgIndex<0){imgIndex=imgCount-1;}
showImg(imgIndex);
})
$(".slideBox").hover(
function(){
clearInterval(timer);
},
function(){
timer = setInterval(function(){
$(".next").trigger("click")
},3000);
}
)
$(".slideBox").mouseleave();
//轮播图数字导航代码
var imgNavWidth=$(".imgNav").width();
$(".imgNav").css("left",imgWidth/2-imgNavWidth/2); //设置轮播导航居中显示
$(".imgNav li").click(function(){
imgIndex=$(this).index();
showImg(imgIndex);
})
// 下拉菜单
const menu = document.querySelectorAll('.nav_container>li:not(:first-child)');
const menu_ul = document.querySelectorAll('.nav_container>li>ul');
for(let i = 0; i < menu.length; ++i) {
menu[i].onmouseover = function() {
for(let j = 0; j < menu_ul.length; ++j) {
menu_ul[j].style.display = 'none';
}
menu_ul[i].style.display = 'block';
}
menu[i].onmouseout = function() {
menu_ul[i].style.display = "none";
}
}
// 选项卡
const tab_title = document.querySelectorAll('.tab_title>li');
const tab_content = document.querySelectorAll('.tab_content>ul');
for(let i = 0; i < tab_title.length; ++i) {
tab_title[i].onmouseover = function() {
for(let j = 0; j < tab_title.length; ++j) {
tab_title[j].setAttribute('class', '');
}
for(let j = 0; j < tab_content.length; ++j) {
tab_content[j].style.display = 'none';
}
tab_content[i].style.display = 'block';
tab_title[i].setAttribute('class', 'active');
}
}
// 无缝图片滑动
const subject_list = document.querySelector('.subject_list');
const offset = 400, maxCnt = 4;
let now = 0;
function subject_slide(idx) {
subject_list.style.marginLeft = -idx * offset + 'px';
}
function move() {
now = (now + 1) % maxCnt;
subject_slide(now);
}
setInterval(function() {
move();
}, 2000);
// 二维码放大效果
function changeSize(e, w, h) {
e.style.width = w;
e.style.height = h;
}
const qr = document.querySelectorAll('.ewm>dd>img');
for(let i = 0; i < qr.length; ++i) {
qr[i].onmouseover = function() {
changeSize(qr[i], '220px', '230px');
qr[i].style.zIndex = 999;
}
qr[i].onmouseout = function() {
changeSize(qr[i], '100px', '110px');
qr[i].style.zIndex = 0;
}
}