解决微信小程序scroll-view组件无横向滚动的问题
微信开放文档中scroll-view组件的部分代码如下
<scroll-view class="scroll-view_H" scroll-x="true" bindscroll="scroll" style="width: 100%">
<view id="demo1" class="scroll-view-item_H demo-text-1"></view>
<view id="demo2" class="scroll-view-item_H demo-text-2"></view>
<view id="demo3" class="scroll-view-item_H demo-text-3"></view>
</scroll-view>
要实现横向滚动，只需设置以下两个:
- 父元素设置 white-space:nowrap; // 不换行
- 子元素设置 display:inline-block;
.scroll-view_H {
/*设置display:flex无效*/
white-space: nowrap;
}
.scroll-view-item_H {
width: 200rpx;
height:200rpx;
background-color: #f00;
display: inline-block;
}
总结
以上所述是小编给大家介绍的解决微信小程序scroll-view组件无横向滚动的问题，希望对大家有所帮助！
-
本文向大家介绍微信小程序 scroll-view隐藏滚动条详解，包括了微信小程序 scroll-view隐藏滚动条详解的使用技巧和注意事项，需要的朋友参考一下 一：scroll-view隐藏滚动条 在书写网页的时候，往往会为了页面的美观，而选择去掉滚动区域默认的滚动条，而在这里，就是为小程序去掉滚动条的其中的一种方法： scroll-view.wxml: scroll-view.wxss scro
-
本文向大家介绍微信小程序 scroll-view 水平滚动实现过程解析，包括了微信小程序 scroll-view 水平滚动实现过程解析的使用技巧和注意事项，需要的朋友参考一下 1. scroll-view水平滚动使用 1. wxml 2. wxss 2. scroll-view 隐藏滚动条 3. 效果如下： 以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持呐喊教程。
-
问题描述 需求想要展示自定义横向滚动条，但是用sroll-view发现无法显示滚动条，一开始不加scroll-view, 只有一层view，设置overflow-x:scroll， 也是可以滚动但是不显示滚动条。在开发者工具和真机调试都不显示。平时比较少写小程序，麻烦大佬解答一下。 wxml: wxss:
-
本文向大家介绍微信小程序（九）scroll-view组件详细介绍，包括了微信小程序（九）scroll-view组件详细介绍的使用技巧和注意事项，需要的朋友参考一下 scroll-view为滚动视图，分为水平滚动和垂直滚动。注意滚动视图垂直滚动时一定要设置高度否则的话scroll-view不会生效。滚动视图常用的地方一般都是Item项比较多的界面，比如我的模块 主要属性： 使用演示： wxml 相关
-
本文向大家介绍微信小程序scroll-view锚点链接滚动跳转功能，包括了微信小程序scroll-view锚点链接滚动跳转功能的使用技巧和注意事项，需要的朋友参考一下 html js css 总结 以上所述是小编给大家介绍的微信小程序scroll-view锚点链接滚动跳转功能，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对呐喊教程网站的支持！ 如
-
本文向大家介绍小程序scroll-view组件实现滚动的示例代码，包括了小程序scroll-view组件实现滚动的示例代码的使用技巧和注意事项，需要的朋友参考一下 前言：这章我们使用小程序的 scroll-view组件 实现横向滚动和竖向滚动。 GitHub： https://github.com/Ewall1106/miniProgramDemo 1、竖向滚动 首先从简单的来，竖向滚动很简单，只