小程序
小游戏
企业微信
微信支付
扫描小程序码分享
项目中使用swiper插件,实现滑动,上下页面切换。在浏览器模拟器中没什么问题。在微信开发者工具中公众号网页调试,发现滑动不了,请问有人遇到过吗
3 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
做个备注,至今未解决
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
@官方 这个问题有解决方案么??
好像还没有,你找旧版本的微信开发者工具,就可以。新版本的不行
能告知一下你使用的微信开发者工具版本么?
https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1455784140
我用的是这个,再新一点点的也可以,2017年的好像可以
非常非常感谢你的回复,解决了我的问题,这个问题困惑了我两天,怎么都没有想到是微信开发者工具的问题。谢谢
哈哈,没事没事。我之前也以为是插件的原因。后面研究以后才发现是微信开发者工具的问题。
麻烦给个相关的代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html),我们定位下问题
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0'/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.0.2/css/swiper.min.css">
<style>
*{
margin:0;
padding:0;
}
html,body{
height:100%;
body{
font-family:"microsoft yahei";
ul{
list-style: none;
.swiper-container {
width: 100%;
height: 100%;
background:#fff;
.swiper-slide{
width:100%;
background: #fff;
</style>
</head>
<body>
<div class="swiper-container" id="swiperContainer">
<div class="swiper-wrapper">
<!-------------slide1----------------->
<section class="swiper-slide" style="background:pink;">
1
</section>
<!---------------slide2-------------->
<section class="swiper-slide" style="background:yellow;">
2
<!----------------slide3-------------->
<section class="swiper-slide">
3
<!-------------slide4----------------->
4
<!-------------slide5----------------->
5
<!-------------slide6----------------->
6
</div>
<script src="js/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.0.2/js/swiper.min.js"></script>
<!--<script src="js/swiper.min.js"></script>-->
<script>
var mySwiper = new Swiper ('.swiper-container', {
direction : 'vertical',
on: {
//滑动到最后一个slide触发
reachEnd: function(){
console.log('到了最后一个slide');
},
//判断滑动到了哪一页
slideChangeTransitionEnd: function(){
console.log(this.activeIndex);
if(this.activeIndex == 6){
$('#array').css('display','none');
}else{
$('#array').css('display','block');
})
</script>
</body>
</html>
请问这个问题修复了吗,今天遇到了
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
做个备注,至今未解决
@官方 这个问题有解决方案么??
好像还没有,你找旧版本的微信开发者工具,就可以。新版本的不行
能告知一下你使用的微信开发者工具版本么?
https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1455784140
我用的是这个,再新一点点的也可以,2017年的好像可以
非常非常感谢你的回复,解决了我的问题,这个问题困惑了我两天,怎么都没有想到是微信开发者工具的问题。谢谢
哈哈,没事没事。我之前也以为是插件的原因。后面研究以后才发现是微信开发者工具的问题。
麻烦给个相关的代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html),我们定位下问题
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0'/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.0.2/css/swiper.min.css">
<style>
*{
margin:0;
padding:0;
}
html,body{
height:100%;
}
body{
font-family:"microsoft yahei";
}
ul{
list-style: none;
}
.swiper-container {
width: 100%;
height: 100%;
background:#fff;
}
.swiper-slide{
width:100%;
height:100%;
background: #fff;
}
</style>
</head>
<body>
<div class="swiper-container" id="swiperContainer">
<div class="swiper-wrapper">
<!-------------slide1----------------->
<section class="swiper-slide" style="background:pink;">
1
</section>
<!---------------slide2-------------->
<section class="swiper-slide" style="background:yellow;">
2
</section>
<!----------------slide3-------------->
<section class="swiper-slide">
3
</section>
<!-------------slide4----------------->
<section class="swiper-slide">
4
</section>
<!-------------slide5----------------->
<section class="swiper-slide">
5
</section>
<!-------------slide6----------------->
<section class="swiper-slide">
6
</section>
</div>
</div>
<script src="js/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.0.2/js/swiper.min.js"></script>
<!--<script src="js/swiper.min.js"></script>-->
<script>
var mySwiper = new Swiper ('.swiper-container', {
direction : 'vertical',
on: {
//滑动到最后一个slide触发
reachEnd: function(){
console.log('到了最后一个slide');
},
//判断滑动到了哪一页
slideChangeTransitionEnd: function(){
console.log(this.activeIndex);
if(this.activeIndex == 6){
$('#array').css('display','none');
}else{
$('#array').css('display','block');
}
}
}
})
</script>
</body>
</html>
请问这个问题修复了吗,今天遇到了