考个锤子我直接掀桌

//动态设置轮播图背景图片代码

$(".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;

}

}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值