guang-new.page.js
3.49 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
import 'guang/guang-new.page.css';
import $ from 'yoho-jquery';
import Page from 'yoho-page';
import Swiper from 'yoho-swiper';
class GuangNew extends Page {
constructor() {
super();
this.selector = {
$parentObj: $('.swiper-tab'),
$fixed: $('.fixed')
};
this.fixedTop = 0;
this.init();
}
init() {
this.swiperTop();
this.swiperTab();
this.swiperPage();
this.swiperCollocation();
this.swiperLimit();
this.swiperShow();
this.fixed();
this.fixedRetop();
}
// 返回顶部,最新资讯
fixed() {
$(window).scroll(() => {
this.fixedRetop();
});
}
fixedRetop() {
this.fixedTop = this.selector.$parentObj.offset().top - $(document).scrollTop();
if (this.fixedTop <= 0) {
this.selector.$fixed.show();
} else {
this.selector.$fixed.hide();
}
}
// 顶部swiper
swiperTop() {
if ($('.swiper-top').length > 0) {
new Swiper('.swiper-top .swiper-container', {
pagination: '.swiper-pagination .wiper-pagination-bullets',
paginationClickable: true
});
}
}
// 频道swiper
swiperTab() {
if ($('.swiper-tab').length > 0) {
let preWidth = $(window).width() / 750 * -115; // 向左位移一个swiper-slide宽度,相对于750宽度下
new Swiper('.swiper-tab .swiper-container', {
effect: 'coverflow',
loop: true,
grabCursor: true,
slidesPerView: 'auto',
followFinger: false,
slidesOffsetBefore: preWidth,
centeredSlides: true,
speed: 800,
coverflow: {
rotate: 0,
stretch: 0,
depth: 0,
modifier: 1,
slideShadows: false
},
touchRatio: 0.01,
});
}
}
// 人气swiper
swiperPage() {
if ($('.swiper-page').length > 0) {
new Swiper('.swiper-page .swiper-container', {
direction: 'vertical',
effect: 'coverflow',
grabCursor: true,
centeredSlides: true,
slidesPerView: 'auto',
followFinger: false,
loop: true,
coverflow: {
rotate: 0,
stretch: 0,
depth: 0,
modifier: 1,
slideShadows: false
}
});
}
}
// 搭配swiper
swiperCollocation() {
if ($('.swiper-collocation').length > 0) {
new Swiper('.swiper-collocation .swiper-container', {
centeredSlides: true,
slidesPerView: 'auto',
loop: true
});
}
}
// 限定swiper
swiperLimit() {
if ($('.swiper-limit').length > 0) {
new Swiper('.swiper-limit .swiper-container', {
pagination: '.swiper-pagination',
paginationClickable: true
});
}
}
// showswiper
swiperShow() {
if ($('.swiper-show').length > 0) {
new Swiper('.swiper-show .swiper-container', {
slidesPerView: 'auto'
});
}
}
}
$(() => {
new GuangNew();
});