gp-designer 1.0.122 → 1.0.123
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/gp-designer.es.js +197 -195
- package/dist/gp-designer.umd.js +10 -10
- package/dist/spa/topic/js/index.js +1 -90
- package/dist/spa/topic/js/swiper.js +88 -0
- package/package.json +1 -1
|
@@ -1,94 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
1
|
$(function () {
|
|
4
|
-
// 判断是否为移动端 (1200px 以下)
|
|
5
|
-
if (window.innerWidth <= 1200) {
|
|
6
|
-
if ($('.swiper-wrapper').length == 0) {
|
|
7
|
-
return;
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
// 首选循环 swiper-wrapper 对其包装一个父级对象 swiper 以便初始化 Swiper
|
|
11
|
-
$('.swiper-wrapper').each(function () {
|
|
12
|
-
// 查找当前内是否包含 gp-designer-m-swiper-slide 类名，如果没有则不处理
|
|
13
|
-
if ($(this).find('.gp-designer-m-swiper-slide').length == 0) {
|
|
14
|
-
return;
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
$(this).wrap('<div class="swiper flex flex-row w-full"></div>');
|
|
18
|
-
});
|
|
19
|
-
|
|
20
|
-
// 当有多个 swiper 时，循环初始化并验证每个 swiper 中是否包含 swiper-wrapper
|
|
21
|
-
$('.swiper').each(function () {
|
|
22
|
-
if ($(this).find('.swiper-wrapper').length == 0) {
|
|
23
|
-
return;
|
|
24
|
-
}
|
|
25
|
-
// 查找当前内是否包含 gp-designer-m-swiper-slide 类名，如果没有则不处理
|
|
26
|
-
if ($(this).find('.gp-designer-m-swiper-slide').length == 0) {
|
|
27
|
-
return;
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
// 创建轮播点
|
|
31
|
-
let swiperPagination = document.createElement('div');
|
|
32
|
-
swiperPagination.className = 'swiper-pagination';
|
|
33
|
-
$(this).append(swiperPagination);
|
|
34
|
-
|
|
35
|
-
// 创建上一页、下一页按钮
|
|
36
|
-
let swiperButtonPrev = document.createElement('div');
|
|
37
|
-
swiperButtonPrev.className = 'swiper-button-prev';
|
|
38
|
-
$(this).append(swiperButtonPrev);
|
|
39
|
-
|
|
40
|
-
let swiperButtonNext = document.createElement('div');
|
|
41
|
-
swiperButtonNext.className = 'swiper-button-next';
|
|
42
|
-
$(this).append(swiperButtonNext);
|
|
43
|
-
|
|
44
|
-
// // 创建滚动条
|
|
45
|
-
// let swiperScrollbar = document.createElement('div');
|
|
46
|
-
// swiperScrollbar.className = 'swiper-scrollbar';
|
|
47
|
-
// $(this).append(swiperScrollbar);
|
|
48
|
-
|
|
49
|
-
const mySwiper = new Swiper(this, {
|
|
50
|
-
loop: false, // 循环播放
|
|
51
|
-
autoplay: {
|
|
52
|
-
delay: 3000, // 自动播放间隔
|
|
53
|
-
disableOnInteraction: false, // 用户操作后是否停止自动播放
|
|
54
|
-
},
|
|
55
|
-
|
|
56
|
-
// slidesPerView: "auto", // 每次显示 n 个轮播
|
|
57
|
-
// spaceBetween: 30, // 轮播之间的间距
|
|
58
|
-
|
|
59
|
-
// slidesPerView: 3, // 每次显示 3 个轮播
|
|
60
|
-
// spaceBetween: 30, // 轮播之间的间距
|
|
61
|
-
// direction: "vertical", // 垂直滚动
|
|
62
|
-
|
|
63
|
-
// effect: "cards", // 卡片效果
|
|
64
|
-
// grabCursor: true, // 鼠标移动到轮播上时显示手型
|
|
65
|
-
|
|
66
|
-
// 显示轮播点
|
|
67
|
-
pagination: {
|
|
68
|
-
el: '.swiper-pagination',
|
|
69
|
-
|
|
70
|
-
dynamicBullets: true, // 动态显示轮播点
|
|
71
|
-
|
|
72
|
-
clickable: true, // 是否可以点击轮播点切换
|
|
73
|
-
},
|
|
74
|
-
|
|
75
|
-
// // 显示滚动条
|
|
76
|
-
// scrollbar: {
|
|
77
|
-
// el: ".swiper-scrollbar",
|
|
78
|
-
// hide: true, // 是否隐藏滚动条
|
|
79
|
-
// },
|
|
80
|
-
|
|
81
|
-
// 显示上一页、下一页按钮
|
|
82
|
-
navigation: {
|
|
83
|
-
nextEl: '.swiper-button-next',
|
|
84
|
-
prevEl: '.swiper-button-prev',
|
|
85
|
-
},
|
|
86
|
-
});
|
|
87
|
-
});
|
|
88
|
-
} else {
|
|
89
|
-
console.log('非移动端，不初始化 Swiper');
|
|
90
|
-
}
|
|
91
|
-
|
|
92
2
|
// 美洽处理 gp-designer-meiqia 点击事件 _MEIQIA('showPanel'); window["_MEIQIA"]?.("showPanel")
|
|
93
3
|
$('.gp-designer-meiqia').on('click', function () {
|
|
94
4
|
if (window._MEIQIA) {
|
|
@@ -104,3 +14,4 @@ $(function () {
|
|
|
104
14
|
}
|
|
105
15
|
});
|
|
106
16
|
});
|
|
17
|
+
|
|
@@ -0,0 +1,88 @@
|
|
|
1
|
+
$(function () {
|
|
2
|
+
|
|
3
|
+
// 初始化 Swiper，只有移动端才触发
|
|
4
|
+
|
|
5
|
+
if ($('.swiper-wrapper').length == 0) {
|
|
6
|
+
return;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
// 首选循环 swiper-wrapper 对其包装一个父级对象 swiper 以便初始化 Swiper
|
|
10
|
+
$('.swiper-wrapper').each(function () {
|
|
11
|
+
// 查找当前内是否包含 gp-designer-m-swiper-slide 类名，如果没有则不处理
|
|
12
|
+
if ($(this).find('.gp-designer-m-swiper-slide').length == 0) {
|
|
13
|
+
return;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
$(this).wrap('<div class="swiper flex flex-row w-full"></div>');
|
|
17
|
+
});
|
|
18
|
+
|
|
19
|
+
// 当有多个 swiper 时，循环初始化并验证每个 swiper 中是否包含 swiper-wrapper
|
|
20
|
+
$('.swiper').each(function () {
|
|
21
|
+
if ($(this).find('.swiper-wrapper').length == 0) {
|
|
22
|
+
return;
|
|
23
|
+
}
|
|
24
|
+
// 查找当前内是否包含 gp-designer-m-swiper-slide 类名，如果没有则不处理
|
|
25
|
+
if ($(this).find('.gp-designer-m-swiper-slide').length == 0) {
|
|
26
|
+
return;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
// 创建轮播点
|
|
30
|
+
let swiperPagination = document.createElement('div');
|
|
31
|
+
swiperPagination.className = 'swiper-pagination';
|
|
32
|
+
$(this).append(swiperPagination);
|
|
33
|
+
|
|
34
|
+
// 创建上一页、下一页按钮
|
|
35
|
+
// let swiperButtonPrev = document.createElement('div');
|
|
36
|
+
// swiperButtonPrev.className = 'swiper-button-prev';
|
|
37
|
+
// $(this).append(swiperButtonPrev);
|
|
38
|
+
|
|
39
|
+
// let swiperButtonNext = document.createElement('div');
|
|
40
|
+
// swiperButtonNext.className = 'swiper-button-next';
|
|
41
|
+
// $(this).append(swiperButtonNext);
|
|
42
|
+
|
|
43
|
+
// // 创建滚动条
|
|
44
|
+
// let swiperScrollbar = document.createElement('div');
|
|
45
|
+
// swiperScrollbar.className = 'swiper-scrollbar';
|
|
46
|
+
// $(this).append(swiperScrollbar);
|
|
47
|
+
|
|
48
|
+
const mySwiper = new Swiper(this, {
|
|
49
|
+
loop: false, // 循环播放
|
|
50
|
+
autoplay: {
|
|
51
|
+
delay: 3000, // 自动播放间隔
|
|
52
|
+
disableOnInteraction: false, // 用户操作后是否停止自动播放
|
|
53
|
+
},
|
|
54
|
+
|
|
55
|
+
// slidesPerView: "auto", // 每次显示 n 个轮播
|
|
56
|
+
// spaceBetween: 30, // 轮播之间的间距
|
|
57
|
+
|
|
58
|
+
// slidesPerView: 3, // 每次显示 3 个轮播
|
|
59
|
+
// spaceBetween: 30, // 轮播之间的间距
|
|
60
|
+
// direction: "vertical", // 垂直滚动
|
|
61
|
+
|
|
62
|
+
// effect: "cards", // 卡片效果
|
|
63
|
+
// grabCursor: true, // 鼠标移动到轮播上时显示手型
|
|
64
|
+
|
|
65
|
+
// 显示轮播点
|
|
66
|
+
pagination: {
|
|
67
|
+
el: '.swiper-pagination',
|
|
68
|
+
|
|
69
|
+
dynamicBullets: true, // 动态显示轮播点
|
|
70
|
+
|
|
71
|
+
clickable: true, // 是否可以点击轮播点切换
|
|
72
|
+
},
|
|
73
|
+
|
|
74
|
+
// // 显示滚动条
|
|
75
|
+
// scrollbar: {
|
|
76
|
+
// el: ".swiper-scrollbar",
|
|
77
|
+
// hide: true, // 是否隐藏滚动条
|
|
78
|
+
// },
|
|
79
|
+
|
|
80
|
+
// 显示上一页、下一页按钮
|
|
81
|
+
navigation: {
|
|
82
|
+
nextEl: '.swiper-button-next',
|
|
83
|
+
prevEl: '.swiper-button-prev',
|
|
84
|
+
},
|
|
85
|
+
});
|
|
86
|
+
});
|
|
87
|
+
});
|
|
88
|
+
|