| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169 |
- window.addEventListener('scroll', handleScroll, true)
- function handleScroll() {
- if (window.scrollY > 100) {
- document.getElementsByClassName('handler-app-android-download').item(0).className = "handler-app-android-download"
- document.getElementsByClassName("handler-to-top").item(0).style.display = "block"
- } else {
- document.getElementsByClassName('handler-app-android-download').item(0).className = "handler-app-android-download handler-item-bottom"
- document.getElementsByClassName("handler-to-top").item(0).style.display = "none"
- }
- }
- function ToTop() {
- window.scrollTo({
- top: 0,
- behavior: 'smooth'
- })
- }
- //todo 首页轮播图
- window.onload = function () {
- var items = document.getElementsByClassName("item");
- var circles = document.getElementsByClassName("circle");
- var leftBtn = document.getElementById("btn-left");
- var rightBtn = document.getElementById("btn-right");
- var content = document.querySelector('.content');
- var index = 0;
- var timer = null;
- //清除class
- var clearclass = function () {
- for (let i = 0; i < items.length; i++) {
- items[i].className = "item";
- circles[i].className = "circle";
- circles[i].setAttribute("num", i);
- }
- }
- /*只显示一个class*/
- function move() {
- clearclass();
- items[index].className = "item active";
- circles[index].className = "circle white";
- }
- //点击右边按钮切换下一张图片
- rightBtn.onclick = function () {
- if (index === items.length - 1) {
- index = 0;
- } else {
- index++
- }
- move();
- }
- //点击左边按钮切换上一张图片
- leftBtn.onclick = function () {
- if (index === 0) {
- index = items.length - 1;
- } else {
- index--
- }
- move();
- }
- //开始定时器,点击右边按钮,实现轮播
- rightBtn.onclick();
- timer = setInterval(function () {
- rightBtn.onclick();
- }, 3000)
- //点击圆点时,跳转到对应图片
- for (var i = 0; i < circles.length; i++) {
- circles[i].addEventListener("click", function () {
- var point_index = this.getAttribute("num");
- index = point_index;
- move();
- })
- }
- //鼠标移入清除定时器,并开启一个三秒的定时器,使慢慢转动
- content.onmouseover = function () {
- clearInterval(timer);
- timer = setInterval(function () {
- rightBtn.onclick();
- }, 3000)
- }
- //鼠标移出又开启定时器
- content.onmouseleave = function () {
- clearInterval(timer);
- timer = setInterval(function () {
- rightBtn.onclick();
- }, 1500)
- }
- }
- var CardListElements = null
- //初始化加载 topic列表
- function TopicListShowLoad() {
- CardListElements = document.getElementsByClassName("card-list");
- for (let i = 0; i < CardListElements.length; i++) {
- let goodsInfoEles = CardListElements[i].getElementsByClassName("goods-info")
- for (let i = 0; i < goodsInfoEles.length; i++) {
- if (goodsInfoEles[i].getAttribute("index") > 12) {
- goodsInfoEles[i].style.display = "none";
- }
- }
- let showEle = CardListElements[i].getElementsByClassName("card-show")
- if (!showEle || showEle.length === 0) {
- continue
- }
- let linkElement = showEle.item(0).getElementsByTagName("a").item(0);
- linkElement.addEventListener("click", (e) => {
- if (linkElement.getAttribute("show")==="true") {
- linkElement.setAttribute("show", "false");
- linkElement.innerHTML = "查看更多";
- for (let i = 0; i < goodsInfoEles.length; i++) {
- if (goodsInfoEles[i].getAttribute("index") > 12) {
- goodsInfoEles[i].style.display = "none";
- }
- }
- } else {
- linkElement.setAttribute("show", "true");
- linkElement.innerHTML = "收起";
- for (let i = 0; i < goodsInfoEles.length; i++) {
- if (goodsInfoEles[i].getAttribute("index") > 12) {
- goodsInfoEles[i].style.display = "inline-block";
- }
- }
- }
- })
- }
- // let goodsInfoEles = document.getElementsByClassName("goods-info");
- // for (let i = 0; i < goodsInfoEles.length; i++) {
- // if (goodsInfoEles[i].getAttribute("index") > 12) {
- // goodsInfoEles[i].style.display = "none";
- // }
- // }
- }
- // fetch('/api/order/submit', {
- // method: 'POST',
- // headers: {
- // 'Content-Type': 'application/json'
- // },
- // body: JSON.stringify(data)
- // })
- // .then(response => response.json())
- // .then(data => {
- // console.log('Success:', data);
- // alert("假装购买成功");
- // })
- // .catch((error) => {
- // console.error('Error:', error);
- // alert("购买失败");
- // });
- handleScroll()
- TopicListShowLoad()
|