scroll-x="true" 出现横向滚动

scroll-with-animation="true" 横向滚动有动画
<scroll-view class="scrool-more" scroll-x="true" scroll-with-animation="true">
<text class="label-name" v-for="(item,index) in listTypecont"
:key="index">{{item.name }}</text>
</scroll-view> listTypecont:[
{name:"张三"},
{name:"张三"},
{name:"张三"},
{name:"张三"},
{name:"张三"},
{name:"张三"},
{name:"张三"},
{name:"张三"},
{name:"张三"},
{name:"张三"},
] .scrool-more{
white-space: nowrap; 必须要这个属性,否者不能出现横线滚动
width: 100%;
height: 56rpx;
display: inline-block;
} .label-name{
width: 140rpx;
height: 40rpx;
color: #fff; padding: 20rpx;
background: pink;
}

uniapp横向滚动的更多相关文章

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

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

  2. 一款兼容IE6并带有多图横向滚动的jquery特效

    一款兼容IE6并带有多图横向滚动的jquery特效,自动切换多个图片的jquery特效效果, 为大家分享这个的原因是,这款特效在兼容IE6上面很完美,实用性就广很多了. 适用浏览器:IE6.IE7.I ...

  3. 李洪强iOS开发之后使用XIB实现横向滚动的UIScrollView

    李洪强iOS开发之后使用XIB实现横向滚动的UIScrollView 11111222

  4. 李洪强iOS开发之后使用纯代码实现横向滚动的UIScrollView

    李洪强iOS开发之后使用纯代码实现横向滚动的UIScrollView (VTmagic是一个实现左右滚动的控制器的框架,也可以实现此功能) 实现的效果:  01 - 创建四个控制器 02 - 定义需要 ...

  5. 李洪强实现横向滚动的View<二>

    上一节中我们已经实现了一个带有图片,标题和价格label 的UIView 这节我们用这个view实现一个横向滚动的UIcollectionView 实现的效果如下:  01 - 创建CFTyreScr ...

  6. js实现文字横向滚动

    页面布局      <div id="scroll_div" class="fl">         <div id="scroll ...

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

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

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

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

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

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

  10. 利用overflow-x实现横向滚动的xiaoguo

    在进行app开发中经常遇到横向滚动的效果,相信很多人都是用js写的吧,其实用css的overflow-x也可以写出啦哦~~~ (1)介绍overflow-x: 1)浏览器支持 所有主流浏览器都支持 o ...

随机推荐

  1. 敏捷开发:Scrum 中的 Product Backlog 介绍

    Product Backlog 产品待办列表 在计划开发产品功能时,都希望产品功能上线后,用户能够喜欢并经常使用. 因此在开发产品新功能时,就要衡量哪些产品需求是对用户最有价值,这是最应该思考的问题. ...

  2. ABP实践(5)-abp前端vue框架之IView实现三级菜单(博友需要特此分享)

    为响应博友想要知道三级菜单怎么实现本篇文章先介绍三级菜单的实现,后续再分享其他部分内容 1 修改菜单组件sidebarMenu.vue 图为原代码和修改后代码比对 修改前后的源码如下 <styl ...

  3. cento 申请ssl证书笔记

    如果您的Certbot工具没有内置的Nginx插件,您可以尝试以下方法来申请证书并配置Nginx服务器: 安装Certbot的Nginx插件: sudo yum install certbot-ngi ...

  4. Docker Logs清理

    查看docker日志路径 docker inspect --format='{{.LogPath}}' <container_name_or_id> 清理docker日志 echo |su ...

  5. GienTech动态|入选软件和信息技术服务名牌企业;荣获城市数字化转型优秀案例;参加第四届深圳国际人工智能展

    ​ 中电金信入选"2023第二届软件和信息技术服务名牌企业" ​ 近日,中国电子信息行业联合会发布了"2023第二届软件和信息技术服务名牌企业"名单,中电金信入 ...

  6. 我们为什么选择Vue.js而不是React(转载)

    这篇非常好,可以当做 why React sucks 看 ;D 其实 vue 也不如 molecule 最近,Qwintry开发团队把很多项目都迁移至Vue.js,包括所有遗留的项目和新开始的项目: ...

  7. 【前端】【H5 API】addEventListener监听网络状态的变动

    WebviewObject Webview窗口对象,用于操作加载HTML页面的窗口 属性 id:webview窗口的标识 方法:监听 addEventListener 添加事件监听器 wobj.add ...

  8. maven常见命令之 -pl -am -amd

    昨天maven的deploy任务需要只选择单个模块并且把它依赖的模块一起打包,第一时间便想到了-pl参数,然后就开始处理,但是因为之前只看了一下命令的介绍,竟然花了近半小时才完全跑通,故记录此文. 假 ...

  9. Composer: Command Not Found

    I am using CentOS and had same problem. I changed /usr/local/bin/composer to /usr/bin/composer and i ...

  10. MySQL said: Authentication plugin 'caching_sha2_password' cannot be loaded

    OUTLINE问题描述解决方案问题描述在mac下,用sequel pro连接数据库,出现以下问题: MySQL said: Authentication plugin 'caching_sha2_pa ...