微信小程序-横向滑动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 相关文章推荐
用JTrackBar实现的模拟苹果风格的滚动条
Aug 06 Javascript
JQuery实现表格中相同单元格合并示例代码
Jun 26 Javascript
js获取IFRAME当前的URL的方法
Nov 13 Javascript
node.js中的path.resolve方法使用说明
Dec 08 Javascript
JavaScript对数组进行随机重排的方法
Jul 22 Javascript
jQuery下拉美化搜索表单效果代码分享
Aug 25 Javascript
js判断当前页面用什么浏览器打开的方法
Jan 06 Javascript
DOM操作原生js 的bug,使用jQuery 可以消除的解决方法
Sep 04 Javascript
Puppeteer环境搭建的详细步骤
Sep 21 Javascript
微信小程序自定义tabbar custom-tab-bar 6s出不来解决方案(cover-view不兼容)
Nov 01 Javascript
JS获取当前时间的年月日时分秒及时间的格式化的方法
Dec 18 Javascript
JavaScript实现京东快递单号查询
Nov 30 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
文章推荐系统(三)
2006/10/09 PHP
php入门学习知识点五 关于php数组的几个基本操作
2011/07/14 PHP
PHP中::、-&amp;gt;、self、$this几种操作符的区别介绍
2013/04/24 PHP
PHP之APC缓存详细介绍 apc模块安装
2014/01/13 PHP
thinkphp中html:list标签传递多个参数实例
2014/10/30 PHP
php随机生成数字字母组合的方法
2015/03/18 PHP
PHP实现微信发红包程序
2015/08/24 PHP
在网页中屏蔽快捷键
2006/09/06 Javascript
百度留言本js 大家可以参考下
2009/10/13 Javascript
关于jquery性能最佳实践的讨论,与求教
2012/03/30 Javascript
学习js在线html(富文本,所见即所得)编辑器
2012/12/18 Javascript
javascript实现获取浏览器版本、操作系统类型
2015/01/29 Javascript
面向切面编程(AOP)的理解
2015/05/01 Javascript
基于Javascript实现的不重复ID的生成器
2016/12/25 Javascript
浅谈原型对象的常用开发模式
2017/07/22 Javascript
详解Vue快速零配置的打包工具——parcel
2018/01/16 Javascript
基于React+Redux的SSR实现方法
2018/07/03 Javascript
Vue.js 事件修饰符的使用教程
2018/11/01 Javascript
JavaScript学习笔记之数组基本操作示例
2019/01/09 Javascript
JS实现根据详细地址获取经纬度功能示例
2019/04/16 Javascript
layui点击左侧导航栏,实现不刷新整个页面,只刷新局部的方法
2019/09/25 Javascript
Vue最新防抖方案(必看篇)
2019/10/30 Javascript
js实现复制粘贴的两种方法
2020/12/04 Javascript
python获取文件版本信息、公司名和产品名的方法
2014/10/05 Python
numpy中索引和切片详解
2017/12/15 Python
python自动化测试之DDT数据驱动的实现代码
2019/07/23 Python
html5 canvas简单封装一个echarts实现不了的饼图
2018/06/12 HTML / CSS
ZINVO手表官网:男士和女士手表
2019/03/10 全球购物
The Athlete’s Foot新西兰:新西兰最大的运动鞋零售商
2019/12/23 全球购物
Penhaligon’s英国官网:成立于1870年的英国香水制造商
2021/02/18 全球购物
关于递归的一道.NET面试题
2013/05/12 面试题
项目建议书范文
2014/05/12 职场文书
文明和谐家庭事迹材料
2014/05/18 职场文书
我们的节日中秋活动方案
2014/08/19 职场文书
课前一分钟演讲稿
2014/08/26 职场文书
《我在为谁工作》:工作的质量往往决定生活的质量
2019/12/27 职场文书