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

 更新时间:2017年04月20日 08:33:15   作者:Mr_Sparta  
本篇文章主要介绍了微信小程序-横向滑动scroll-view隐藏滚动条的相关知识。具有很好的参考价值。下面跟着小编一起来看下吧

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: '玻璃棧道',
    desc: '22W人去過'
   }, {
    pic: '/images/example2.png',
    title: '玻璃棧道',
    desc: '22W人去過'
   }, {
    pic: '/images/example2.png',
    title: '玻璃棧道',
    desc: '22W人去過'
   }, {
    pic: '/images/example2.png',
    title: '玻璃棧道',
    desc: '22W人去過'
   }, {
    pic: '/images/example2.png',
    title: '玻璃棧道',
    desc: '22W人去過'
   }
  ]
 }

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

相关文章

  • 详解JavaScript数组reduce()方法的高级技巧

    详解JavaScript数组reduce()方法的高级技巧

    reduce() 是 JavaScript 中一个很有用的数组方法,这篇文章主要介绍了JavaScript中reduce()方法的高级技巧,感兴趣的小伙伴可以了解一下
    2023-03-03
  • 微信小程序静默登录和维护自定义登录态详解

    微信小程序静默登录和维护自定义登录态详解

    这篇文章主要给大家介绍了关于微信小程序静默登录和维护自定义登录态的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-05-05
  • js实现数组去重方法及效率對比

    js实现数组去重方法及效率對比

    本文主要介绍了js实现数组去重方法及效率對比。具有很好的参考价值,下面跟着小编一起来看下吧
    2017-02-02
  • Javascript实现字数统计

    Javascript实现字数统计

    现在流行的Twitter等微博客网站,有一个很好的用户体验,就是在文本框中输入文字的时候,会自动统计输入的字符,并显示用户还能输入的字符,在限制了140个字的微博客中,这样的小提示可以很好的增强用户体验。
    2015-07-07
  • JavaScript实现的七种排序算法总结(推荐!)

    JavaScript实现的七种排序算法总结(推荐!)

    这篇文章主要给大家介绍了关于JavaScript实现的七种排序算法的相关资料,七种排序算法分别是:冒泡排序、选择排序、插入排序、希尔排序、堆排序、快速排序以及归并排序,需要的朋友可以参考下
    2021-07-07
  • js给dropdownlist添加选项的小例子

    js给dropdownlist添加选项的小例子

    js给dropdownlist添加选项的小例子,需要的朋友可以参考一下
    2013-03-03
  • uniapp中input聚焦禁止软键盘弹出方法

    uniapp中input聚焦禁止软键盘弹出方法

    在使用uni-app完成扫码功能时,有时需要聚焦文本框的同时,需要软键盘消失,下面这篇文章主要给大家介绍了关于uniapp中input聚焦禁止软键盘弹出的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
    2023-01-01
  • js前端登录加密解决方案

    js前端登录加密解决方案

    项目中需要前端书写登录页面,用户输入账号密码,本文主要介绍了js前端登录加密解决方案,具有一定的参考价值,感兴趣的可以了解一下
    2024-02-02
  • 微信小程序动态生成二维码的实现代码

    微信小程序动态生成二维码的实现代码

    这篇文章主要介绍了微信小程序动态生成二维码的实现代码,需要的朋友可以参考下
    2018-07-07
  • JavaScript新手必看之var在for循环中的坑

    JavaScript新手必看之var在for循环中的坑

    var这个关键字在JS当中是相当常用的,但同时配合到for循环的话会出现不符合预期的运行结果,所以本文就来为大家讲讲如何避免这种情况的出现
    2023-05-05

最新评论