Files
ClassContent/项目合集/轮播图/index.js
2024-09-27 02:06:13 +08:00

74 lines
1.2 KiB
JavaScript

var time = null;
$(".next").onclick = () => {
motion(-520)
}
$(".prev").onclick = () => {
motion(520)
}
// 小圆点点击事件
_(".dot li").forEach((v,i) => {
v.onclick = function () {
changeDot(i)
}
});
function changeDot(index) {
var liArr = _(".dot li")
liArr.forEach((itme) => {
itme.classList.remove("active")
})
liArr[index].classList.add("active")
set_left(index * -520)
}
function motion(offset) {
var totalOffset = left() + offset;
if (totalOffset < -1040) {
totalOffset = 0
}
if (totalOffset > 0) {
totalOffset = -1040
}
set_left(totalOffset)
changeDot(totalOffset / -520)
}
function autoPlay() {
time = setInterval(() => {
$(".next").onclick()
}, 1000)
}
$(".main").onmouseover = () => {
clearInterval(time)
}
// $(".main").onmouseout = () => {
// autoPlay()
// }
//
// autoPlay()
function set_left(offset) {
$(".swiper").style.left = `${offset}px`;
}
function left() {
return parseInt($(".swiper").style.left)
}
function $(className) {
return document.querySelector(className)
}
function _(className) {
return document.querySelectorAll(className)
}