小程序中有横向滚动的swiper,H5中目前得手动实现。

实现方法如下:

外层需要设置:

overflow: scroll;white-space: nowrap;

内层需要设置:
display: inline-block; 
 <div class="noticeListBox">
<div class="noticeList" v-for="(item,index) in 10"> </div>
</div>
.noticeListBox {
width: 100%;
box-sizing: border-box;
overflow: scroll;
white-space: nowrap;
} .noticeListBox::-webkit-scrollbar {
display: none;
} .noticeList{
display: inline-block;
}

H5实现横向滚动的方法总结的更多相关文章

  1. 使 WPF 支持触摸板的横向滚动

    微软终于开始学苹果一样好好做触摸板了(就是键盘空格键下面那一大块).然而鉴于以前没有好好做,以至于 WPF 程序甚至都没有对触摸板的横向滚动提供支持(竖向滚动是直接使用了 MouseWheel,汗-- ...

  2. web开发 小方法1-禁止横向滚动

    最近学了学做了个公司的网站  总结了一些小方法 比如取消横向滚动条并禁止的横向滚动 这样就可以吧超出的切掉让网页更和谐 在body 标签 body{ text-align: center; overf ...

  3. swiper3d横向滚动多张炫酷切换banner

    最近有了个新需求,swiper3d横向滚动多张炫酷切换banner要和elementUI里边走马灯的卡片化card 类似,但是还需要h5手机触摸滚动啊啊啊啊,昨天折腾了半个早上总算完成,今天乖乖跑来m ...

  4. 【吉光片羽】js横向滚动与浮动导航

    1.横向滚动,这个方法是见过最简洁的了. #demo { background: #FFF; overflow: hidden; border: 1px dashed #CCC; width: 117 ...

  5. Android简易实战教程--第四十六话《RecyclerView竖向和横向滚动》

    Android5.X后,引入了RecyclerView,这个控件使用起来非常的方便,不但可以完成listView的效果,而且还可以实现ListView无法实现的效果.当然,在新能方便也做了大大的提高. ...

  6. 使用elementUI滚动条之横向滚动

    用过elementUI组件应该会知道它内置一个滚动效果,官网对此组件没有相关文档,也是细心网友发现的. <el-scrollbar></el-scrollbar> 将会出现滚动 ...

  7. 解决iScroll横向滚动区域无法拉动页面的问题

    近期项目中使用iScroll遇到一个问题,在设定wrapper为横向滚动时,如果你手指放在该区域,将无法拉动页面,也就是说该区域取消了默认事件.这个体验是实在是无法接受,特别是页面中有多个横向滚动区域 ...

  8. react-native 横向滚动的商品展示

    在app中会有这种页面 像这样商品是横向的,而且要滚动,思路是利用 ScrollView 横向的滚动 思路: (a): 横向滚动的整体作为一个组件  ShopCenter {/*** 横向滚动 *** ...

  9. Android TextView 横向滚动(跑马灯效果)

    Android TextView 中当文字比較多时希望它横向滚动显示,以下是一种亲測可行的方法. 效果图: 1.自己定义TextView,重写isFocused()方法返回true,让自己定义Text ...

随机推荐

  1. 基准测试工具:Wrk初识

    最近和同事聊起常用的一些压测工具,谈到了Apache ab.阿里云的PTS.Jmeter.Locust以及wrk各自的一些优缺点和适用的场景类型. 这篇博客,简单介绍下HTTP基准测试工具wrk的基本 ...

  2. 【已解決】谷歌浏览器如何清理缓存(cookie)

    清除缓存快捷键 Ctrl+Shift+Delete

  3. 用python完成排序算法

    排序算法总结 冒泡排序 相邻两个元素,两两循环比较,每趟筛选出一个最大或者最小的元素(有序区在后面) def bubble_sort(data): # 第一层循环:循环一次,代表一趟,并筛选出一个最大 ...

  4. C#使用SMTP协议发送验证码到QQ邮箱

    C#使用SMTP协议发送验证码到QQ邮箱 在程序设计中,发送验证码是常见的一个功能,用户在注册账号时或忘记密码后,通常需要发送验证码到手机短信或邮箱来验证身份,此篇博客介绍在C#中如何使用SMTP协议 ...

  5. Qt 使用QLabel、QMovie加载gif图片实现动态等待窗口

    新建基于Widget的应用程序,在ui的窗口中添加QLabel,对象名label,调整整个窗口大小. 准备loading.gif图片  Widget.cpp  12345678910111213141 ...

  6. IOS 微信、QQ、叮叮等APP虚拟定位 实在太好用了

    前不久爱思助手更新了最新版本:V7.96,同时更新了好几个功能,包括给ios设备修改虚拟定位功能,想要给手机修改,我们需要电脑下载爱思助手最新版本V7.96,数据线连接电脑修改. 借助爱思助手的虚拟定 ...

  7. 排序算法的c++实现——插入排序

    插入排序的思想是:给定一个待排序的数组,我们从中选择第一个元素作为有序的基态(单个元素肯定是有序的), 然后从剩余的元素中选择一个插入到有序的基态中,使插入之后的序列也是有序状态,重复此过程,直到全部 ...

  8. APP安全测试

    app 常见风险 一. clinet端 1.反编译 2.签名破解 3.调试 4.导出组件 5.拒绝服务 6.输入记录 二.传输 1.信息泄露,未使用加密服务(ssl) 2.篡改 三.服务端 1.SQL ...

  9. JMETER 使用BeanShell 配合 if 控制器实现逻辑控制

    业务场景 在登录后,我们根据登录的响应,判断是否执行下一步的操作. 实现步骤 1.在登录采样器树中增加BeanShell 监听器. 作用是在线程上下文变量中增加一个变量,表示登录是否成功. beans ...

  10. mysql显示一张表的索引

    show index from tm_show.fulfillment_order;show index from tm_show.express_verify;show index from tra ...