BJ_web_developers / webportal

Blame view

js/services.js 3.29 KB
Edit Raw Normal View History
4354a61b   Andy   服务页 集团部分 
1
2
 
  
  //集团 tab 切换
2459da42   Andy   add service swiper 
3
 
  var mySwiper2 = new Swiper('#swiper-tab3',{
eabbfe41   Andy   add service 
4
5
6
7
8
9
10
 
      watchSlidesProgress : true,
      watchSlidesVisibility : true,
      slidesPerView : 3,//将tabs块儿平均分成几份
  
      /*点击了上面的滑块时，下面的内容区也跟着变化  若去掉后，拖动下面上面可继续移动*/
      onTap: function(){
          mySwiper3.slideTo( mySwiper2.clickedIndex)
0ac619a0   Andy   add 
11
 
      }
0ac619a0   Andy   add 
12
0ac619a0   Andy   add 
13
0ac619a0   Andy   add 
14
2459da42   Andy   add service swiper 
15
16
 
  });
  var mySwiper3 = new Swiper('#swiper-con3',{
eabbfe41   Andy   add service 
17
18
 
  
      onSlideChangeStart: function(){
2459da42   Andy   add service swiper 
19
 
          updateNavPosition3()
eabbfe41   Andy   add service 
20
21
 
      }
2459da42   Andy   add service swiper 
22
23
 
  });
  function updateNavPosition3(){
eabbfe41   Andy   add service 
24
 
  //默认哪一块是被选中的状态
2459da42   Andy   add service swiper 
25
26
 
      $('#swiper-tab3 .active-nav').removeClass('active-nav')
      var activeNav = $('#swiper-tab3 .swiper-slide').eq(mySwiper3.activeIndex).addClass('active-nav');
0ac619a0   Andy   add 
27
0ac619a0   Andy   add 
28
eabbfe41   Andy   add service 
29
30
31
32
33
34
35
36
37
38
39
40
 
      if (!activeNav.hasClass('swiper-slide-visible')) {
          console.log(1);
          if (activeNav.index()>mySwiper2.activeIndex) {
              console.log(2);
              var thumbsPerNav = Math.floor(mySwiper2.width/activeNav.width())-1
              mySwiper2.slideTo(activeNav.index()-thumbsPerNav)
          }
          else {
              console.log(3);
              mySwiper2.slideTo(activeNav.index())
          }
      }
2459da42   Andy   add service swiper 
41
42
43
44
45
46
47
48
49
50
51
52
53
 
  };
  
  //车场 tab 切换
  var mySwiper4 = new Swiper('#swiper-tab4',{
      watchSlidesProgress : true,
      watchSlidesVisibility : true,
      slidesPerView : 3,//将tabs块儿平均分成几份
  
      /*点击了上面的滑块时，下面的内容区也跟着变化  若去掉后，拖动下面上面可继续移动*/
      onTap: function(){
          mySwiper5.slideTo( mySwiper4.clickedIndex)
      }
eabbfe41   Andy   add service 
54
c39dc7ee   Andy   服务 add css3 
55
6debfb8d   Andy   add 
56
 
  });
2459da42   Andy   add service swiper 
57
58
59
60
61
 
  var mySwiper5 = new Swiper('#swiper-con4',{
  
      onSlideChangeStart: function(){
          updateNavPosition4()
      }
b9b68354   Andy   服务页 车场 车主模块 
62
b9b68354   Andy   服务页 车场 车主模块 
63
 
  });
2459da42   Andy   add service swiper 
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
 
  function updateNavPosition4(){
  //默认哪一块是被选中的状态
      $('#swiper-tab4 .active-nav').removeClass('active-nav')
      var activeNav = $('#swiper-tab4 .swiper-slide').eq(mySwiper5.activeIndex).addClass('active-nav');
  
  
      if (!activeNav.hasClass('swiper-slide-visible')) {
          if (activeNav.index()>mySwiper4.activeIndex) {
              var thumbsPerNav = Math.floor(mySwiper4.width/activeNav.width())-1
              mySwiper4.slideTo(activeNav.index()-thumbsPerNav)
          }
          else {
              mySwiper4.slideTo(activeNav.index())
          }
      }
  };
b9b68354   Andy   服务页 车场 车主模块 
81
b48b7eca   Andy   media 服务页 
82
 
  //车主 tab 切换
2459da42   Andy   add service swiper 
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
 
  var mySwiper6 = new Swiper('#swiper-tab5',{
      watchSlidesProgress : true,
      watchSlidesVisibility : true,
      slidesPerView : 3,//将tabs块儿平均分成几份
  
      /*点击了上面的滑块时，下面的内容区也跟着变化  若去掉后，拖动下面上面可继续移动*/
      onTap: function(){
          mySwiper7.slideTo( mySwiper6.clickedIndex)
      }
  
  
  
  });
  var mySwiper7 = new Swiper('#swiper-con5',{
  
      onSlideChangeStart: function(){
          updateNavPosition5()
      }
54822d57   liuqimichale   服务 click 切换 
102
 
  });
2459da42   Andy   add service swiper 
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
 
  function updateNavPosition5(){
  //默认哪一块是被选中的状态
      $('#swiper-tab5 .active-nav').removeClass('active-nav')
      var activeNav = $('#swiper-tab5 .swiper-slide').eq(mySwiper7.activeIndex).addClass('active-nav');
  
  
      if (!activeNav.hasClass('swiper-slide-visible')) {
          if (activeNav.index()>mySwiper6.activeIndex) {
              var thumbsPerNav = Math.floor(mySwiper6.width/activeNav.width())-1
              mySwiper6.slideTo(activeNav.index()-thumbsPerNav)
          }
          else {
              mySwiper6.slideTo(activeNav.index())
          }
      }
  };