isScroll的滚动组件的用法
<div class="wrapper">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
</div>
.wrapper{
position:relative; //这个属性必须写,可以为relative或absolute。原因见js部分
margin:50px auto; //上下50px的margin, 水平居中
height:650px; //必须设定scrollbar容器的高度,只有当内容高度超过容器高度的时候,才会显示scrollbar
width:200px;
overflow:hidden; //当父容器高度不足时,只有通过滚动条才能看到超出的内容
background:#eee;
}
ul{
margin:0;
padding:0; //去掉ul默认的样式
list-style:none;
}
ul li{
border:1px solid #ccc;
height:50px;//所有的li高度加起来超过650px,即容器的高度时候,才会出现滚动条
width:100%;
}
详情:https://www.cnblogs.com/yingge/p/5737994.html
isScroll的滚动组件的用法的更多相关文章
- 基于vue的无缝滚动组件
vue-seamless-scroll A simple, Seamless scrolling for Vue.js 在awesome上一直没有发现vue的无缝滚动组件,在工作之余写了个组件,分享出 ...
- 01day-微信小程序 表单组件 动态绑定变量 导航组件 地图组件 view text button 上下滚动组件
04-开发者环境搭建(下载安装开发者工具) 01==>微信开发工具的下载 安装 微信小程序的工具是 下载稳定版本的 安装的时候 直接下一步就可以了 02==>项目名陈随便输入 目录 App ...
- Vue组件基础用法
前面的话 组件(Component)是Vue.js最强大的功能之一.组件可以扩展HTML元素,封装可重用的代码.根据项目需求,抽象出一些组件,每个组件里包含了展现.功能和样式.每个页面,根据自己所需, ...
- layui(七)——rate组件常见用法总结
layui中提供了rate组件,用法很简单,直接上代码. <div id="test1"></div> <script> layui.use(' ...
- viewer && ImageFlow 图片滚动组件 图片点击放大 可以滚轮放大缩小 viewer
ImageFlow https://finnrudolph.com/products/imageflow https://github.com/countzero/ImageFlow http://w ...
- Flutter学习笔记(24)--SingleChildScrollView滚动组件
如需转载,请注明出处:Flutter学习笔记(23)--多 在我们实际的项目开发中,经常会遇到页面UI内容过多,导致手机一屏展示不完的情况出现,以Android为例,在Android中遇到这类情况的做 ...
- iOS开发之多图片无缝滚动组件封装与使用
经常有园友会问"博主,有没有图片无限滚动的Demo呀?", 正儿八经的图片滚动的Demo我这儿还真没有,今天呢就封装一个可以在项目中直接使用的图片轮播.没看过其他iOS图片无限轮播 ...
- vue 自定义marquee无缝滚动组件
先上效果图: (1) 看起来可能有点卡顿,但是实际上页面上看起来挺顺畅的. (2) 思路就是获取每一个列表的宽度,设置定时器移动列表,当移动的距离达到一个列表的宽度的时候,把这个距离放到数组的最后.这 ...
- layui(三)——laypage组件常见用法总结
laypage 的使用非常简单,指向一个用于存放分页的容器,通过服务端得到一些初始值,即可完成分页渲染.核心方法: laypage.render(options) 来设置基础参数. 一.laypag ...
随机推荐
- C++程序中调用其他exe可执行文件方法
在编程过程中有个需求,点击某个按钮需要弹出系统的声音控制面板.在网上查了下代码中调用其他exe程序或者打开其他文件的方法. 自己借鉴网上的文章稍微总结下,加深下印象,也给方便自己用. 在代码中调用其他 ...
- hadoop集群操作常用命令
一.HDFS相关 1.启动NameNode sbin/hadoop-daemon.sh start namenode 2.启动DataNode sbin/hadoop-<span style=& ...
- nginx+php-fpm 报“File not found.”
找网上找了很多帖子,大都是说nginx中的$document_root$换成绝对路径,但是依然不能解决问题 后再把php-fpm配置文件中的 [www]下边的 usr = apache group = ...
- 【面试题】100IT名企java面试必考面试题
一.Java 基础部分 1. JAVA 的基本数据类型有哪些 ? String 是不是基本数据类型 ? Java 有 8 种基本数据类型: byte int ...
- WP8.1学习系列(第十六章)——交互UX之命令模式
命令模式 在本文中 命令类型 命令放置 相关主题 你可以在应用商店应用的几个曲面中放置命令和控件,包括应用画布.弹出窗口.对话框和应用栏.在正确的时间选择合适的曲面可能就是易于使用的应用和很难使用 ...
- vue案例 - v-model实现自定义样式の多选与单选
接,上文:https://www.cnblogs.com/padding1015/p/9265985.html 这两天在玩mpvue,但是下午如果对着文档大眼瞪小眼的话,肯定会睡着的. 想起昨晚的fl ...
- 通过orderby关键字,LINQ可以实现升序和降序排序。LINQ还支持次要排序。
通过orderby关键字,LINQ可以实现升序和降序排序.LINQ还支持次要排序. LINQ默认的排序是升序排序,如果你想使用降序排序,就要使用descending关键字. static void M ...
- Elasticsearch学习之深入搜索四 --- cross-fields搜索
1. cross-fields搜索 一个唯一标识,跨了多个field.比如一个人,标识,是姓名:一个建筑,它的标识是地址.姓名可以散落在多个field中,比如first_name和last_name中 ...
- [Sdoi2016]生成魔咒[SAM or SA]
4516: [Sdoi2016]生成魔咒 Time Limit: 10 Sec Memory Limit: 128 MBSubmit: 1017 Solved: 569[Submit][Statu ...
- 自动释放池autoreleasepool
自动释放池是NSAutoreleasePool的实例,其中包含了收到autorelease消息的对象.当一个自动释放池自身被销毁(dealloc)时,它会给池中每一个对象发送一个release消息(如 ...