https://www.weaver.com.cn/newsite/js/banner.js

1(function () {
2  var delay = 6000
3  var bgc = document.getElementById('bgc')
4  var swiper_m = document.getElementById('mySwiper_m')
5  var tabBigBox = document.getElementsByClassName('box1')
6  var tabSmallBox = document.getElementsByClassName('box2')
7  var forward_page_btn = document.querySelector(
8    '.page_change_btn .forward_page_btn'
9  )
10  var next_page_btn = document.querySelector('.page_change_btn .next_page_btn')
11
12  //上页下页按钮
13  forward_page_btn.addEventListener('click', function () {
14    if (nextIndex == 0) {
15      bgc.style.transition = 'width .3s'
16      bgc.style.left = -num * 100 + '%'
17      setTimeout(function () {
18        nextIndex = 5
19        first = true
20        tabSmallBox[nextIndex].click()
21      }, 10)
22      //先不带动画地快速回到最后一个，再带动画地回到第6张
23    } else {
24      tabSmallBox[nextIndex - 1].click()
25    }
26  })
27  next_page_btn.addEventListener('click', function () {
28    if (nextIndex == 5) {
29      bgc.style.left = -(nextIndex + 1) * 100 + '%' // 位移量
30      setTimeout(function () {
31        nextIndex = 0
32        bgc.style.transition = 'width .3s'
33        bgc.style.left = -nextIndex * 100 + '%'
34        first = false
35        tabSmallBox[nextIndex].click()
36      }, 200) //动画播放完以后，不带动画地快速回到第一个
37    } else {
38      tabSmallBox[nextIndex + 1].click()
39    }
40  })
41
42  if (clientFlag) {
43    // 关闭移动端的轮播图
44    swiper_m.parentNode.removeChild(swiper_m)
45    // console.log(swiper_m)
46    //关闭移动端案例logo
47    $('.case_honorlistmainbox2').remove()
48    $('#TYpagebg').remove()
49    //<---首页轮播图--->
50    //复制第一个节点到最后一个
51    bgc.appendChild(bgc.children[0].cloneNode(true))
52
53    var links = [
54      '//www.weaver.com.cn/e10/index',
55      '//www.weaver.com.cn/case/index',
56      '//www.weaver.com.cn/market/AI/index.html',

57      '//xiaoe.ai/',
58      '//guoqi.weaver.com.cn/',
59      '//yc.weaver.com.cn/',
60    ]
61
62    var num = tabSmallBox.length
63    var nextIndex = 0
64    var timer = null
65    for (var i = 0; i < num; i++) {
66      // 给每个小方块和大方块添加一个属性index
67      tabSmallBox[i].setAttribute('index', i)
68      tabBigBox[i].setAttribute('index', i)
69
70      // 给每个小方块添加点击事件
71      tabSmallBox[i].addEventListener('click', function () {
72        nextIndex = parseInt(this.getAttribute('index'))
73        change(nextIndex)
74      })
75
76      // 给每个大方块添加点击事件
77      tabBigBox[i].addEventListener('click', function () {
78        nextIndex = parseInt(this.getAttribute('index'))
79        //点击alive节点跳转相应链接
80        if (this.classList.contains('alive')) {
81          window.open(links[nextIndex])
82        }
83        change(nextIndex)
84      })
85
86      function change(index) {
87        //清除残存的定时器重新设置
88        if (timer) clearInterval(timer)
89
90        for (var j = 0; j < num; j++) {
91          tabSmallBox[j].classList.remove('alive')
92          tabBigBox[j].classList.remove('alive')
93        }
94        tabSmallBox[index].classList.add('alive')
95        tabBigBox[index].classList.add('alive')
96        //在当前index的大方块下添加进度条阶段
97        // tabBigBox[index].appendChild(progressBar)
98        //背景图案替换
99        if (first) {
100          bgc.style.transition = 'left .3s'
101          bgc.style.left = -index * 100 + '%' // 位移量
102        }
103
104        first = true
105
106        // 设置定时播放
107        timer = setInterval(function () {
108          index++
109          if (index == 6) {
110            bgc.style.left = -index * 100 + '%' // 位移量
111            setTimeout(function () {
112              index = 0
113              bgc.style.transition = 'width .3s'
114              bgc.style.left = -index * 100 + '%'
115              first = false
116              tabSmallBox[index].click()
117            }, 200) //动画播放完以后，不带动画地快速回到第一个
118          } else {
119            tabSmallBox[index].click()
120          }
121        }, delay)
122      }
123    }
124    var first = false
125    change(0)
126  }
127
128  if (!clientFlag) {
129    // 移动端
130    //关闭PC端的轮播图
131    var swiperBtn = document.querySelector('.swiper')
132    var bgImages = document.querySelector('.bgImages')
133    bgImages.parentNode.removeChild(bgImages)
134    swiperBtn.parentNode.removeChild(swiperBtn)
135
136    //关闭PC端端案例logo
137    $('.case_honorlistmainbox').remove()
138    setTimeout(function () {
139      $('.swiperwrapper_slide2').remove()
140      $('#floatbtnPublic').remove()
141      $('.current').remove()
142      $('.caselistindustry_detailsbox_ticobox').remove()
143    }, 200)
144  }
145})()