guang-new.page.js
2.83 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
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 = {};
this.init();
}
init() {
this.swiperTop();
this.swiperTab();
this.swiperPage();
this.swiperCollocation();
this.swiperLimit();
this.swiperShow();
}
// 顶部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 * 104 * 2; // 向左位移两个swiper-slide宽度，相对于750宽度下
new Swiper('.swiper-tab .swiper-container', {
effect: 'coverflow',
loop: true,
grabCursor: true,
slidesPerView: 'auto',
followFinger: false,
slidesOffsetBefore: preWidth,
coverflow: {
rotate: 0,
stretch: 0,
depth: 0,
modifier: 1,
slideShadows: false
}
});
}
}
// 人气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,
coverflow: {
rotate: 0,
stretch: 0,
depth: 0,
modifier: 1,
slideShadows: true
}
});
}
}
// 搭配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();
});