72 lines
1.1 KiB
JavaScript
72 lines
1.1 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((item) => {
|
|
item.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)
|
|
} |