微信小程序-横向滑动scroll-view隐藏滚动条


Posted in Javascript onApril 20, 2017

wxml

<scroll-view class="recommend_scroll_x_box" scroll-x="true">
   <view class="recommend_hot_box" wx:for="{{hotList}}">
    <image src="{{item.pic}}" class="recommend_hot_image"></image>
   </view>
  </scroll-view>

wxss

.recommend_scroll_x_box {
 height: 245rpx;
 white-space: nowrap;
 display: flex;
}

::-webkit-scrollbar {
 width: 0;
 height: 0;
 color: transparent;
}

.recommend_hot_box {
 width: 230rpx;
 height: 245rpx;
 margin-right: 24rpx;
 display: inline-block;
}

.recommend_hot_image {
 width: 230rpx;
 height: 143rpx;
}

js

Page({
 data: {
  hotList: [
   {
    pic: '/images/example2.png',
    title: '玻璃?5?,
    desc: '22W人去?'
   }, {
    pic: '/images/example2.png',
    title: '玻璃?5?,
    desc: '22W人去?'
   }, {
    pic: '/images/example2.png',
    title: '玻璃?5?,
    desc: '22W人去?'
   }, {
    pic: '/images/example2.png',
    title: '玻璃?5?,
    desc: '22W人去?'
   }, {
    pic: '/images/example2.png',
    title: '玻璃?5?,
    desc: '22W人去?'
   }
  ]
 }

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
ExtJS Window 最小化的一种方法
Nov 18 Javascript
js 居中漂浮广告
Mar 21 Javascript
原创javascript小游戏实现代码
Aug 19 Javascript
checkbox全选所涉及到的知识点介绍
Dec 31 Javascript
Node.js中使用jQuery的做法
Aug 17 Javascript
bootstrap制作jsp页面(根据值让table显示选中)
Jan 05 Javascript
JS中使用textPath实现线条上的文字
Dec 25 Javascript
前端MVVM框架解析之双向绑定
Jan 24 Javascript
vue中改变选中当前项的显示隐藏或者状态的实现方法
Feb 08 Javascript
浅析JS中回调函数及用法
Jul 25 Javascript
JS 验证码功能的三种实现方式
Nov 26 Javascript
基于vue和websocket的多人在线聊天室
Feb 01 Javascript
jquery将标签元素的高设为屏幕的百分比
Apr 19 #jQuery
通过js修改input、select默认字体颜色
Apr 19 #Javascript
利用node.js本地搭建HTTP服务器
Apr 19 #Javascript
javascript 的变量、作用域和内存问题
Apr 19 #Javascript
javascript中json对象json数组json字符串互转及取值方法
Apr 19 #Javascript
javascript 中null和undefined区分和比较
Apr 19 #Javascript
jQuery Plupload上传插件的使用
Apr 19 #jQuery
You might like
php设计模式 FlyWeight (享元模式)
2011/06/26 PHP
合并ThinkPHP配置文件以消除代码冗余的实现方法
2014/07/22 PHP
PHP自定义图片缩放函数实现等比例不失真缩放的方法
2016/08/19 PHP
详解php curl带有csrf-token验证模拟提交方法
2018/04/18 PHP
jQuery源码分析之Event事件分析
2010/06/07 Javascript
jquery分页对象使用示例
2014/04/01 Javascript
详解JavaScript中的Unescape()和String() 函数
2015/11/09 Javascript
javascript瀑布流布局实现方法详解
2016/02/17 Javascript
Angular2 多级注入器详解及实例
2016/10/30 Javascript
简单实现bootstrap选项卡效果
2017/02/08 Javascript
vue父子组件的数据传递示例
2017/03/07 Javascript
node操作mysql数据库实例详解
2017/03/17 Javascript
详解Js中的模块化是如何实现的
2017/10/18 Javascript
VueJs使用Amaze ui调整列表和内容页面
2017/11/30 Javascript
实现jquery放大镜的两种方法
2018/02/22 jQuery
vue-cli3+typescript新建一个项目的思路分析
2019/08/06 Javascript
vue+element树组件 实现树懒加载的过程详解
2019/10/21 Javascript
[20:46]Ti4循环赛第三日VG vs DK
2014/07/12 DOTA
一个小示例告诉你Python语言的优雅之处
2014/07/04 Python
Python中dictionary items()系列函数的用法实例
2014/08/21 Python
python3实现读取chrome浏览器cookie
2016/06/19 Python
Python读取系统文件夹内所有文件并统计数量的方法
2018/10/23 Python
Python 20行简单实现有道在线翻译的详解
2019/05/15 Python
FFT快速傅里叶变换的python实现过程解析
2019/10/21 Python
Tensorflow分批量读取数据教程
2020/02/07 Python
Python object类中的特殊方法代码讲解
2020/03/06 Python
NBA欧洲商店(英国):NBA Europe Store UK
2018/07/27 全球购物
迪奥官网:Dior.com
2018/12/04 全球购物
美国转售二手商品的电子商务平台:BLINQ
2018/12/13 全球购物
MySQL面试题
2014/01/12 面试题
大专自我鉴定范文
2013/10/23 职场文书
机关门卫的岗位职责
2014/04/29 职场文书
环保建议书300字
2014/05/14 职场文书
教师学期个人总结
2015/02/11 职场文书
2015年教师工作总结范文
2015/03/31 职场文书
朋友聚会开场白
2015/06/01 职场文书