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 ...
随机推荐
- input回车问题
今天有一个问题,就是input对象没有加任何事件自己回车导致跳到了404页面.处理的时候,并发现没找到回车事件的控制. 那么只有一种情况,就是自带的回车控制. 百度了一下,如下面博文里面的写法.我这边 ...
- .NET二级域名共享Session
ASP.NET二级域名站点共享Session状态 今天, 我要写的是如何在二级域名站点之间,主站点和二级域名站点之间共享Session. 首先, Session要共享,站点之间SessionID必须要 ...
- 【C#新特性】不用out ref同时返回多个值-元组Tuple
元组Tuple,它是一种固定成员的泛型集合 下面先看看官方的一个使用例子: 创建一个包含7个元素的Tuple数组 // Create a 7-tuple. , , , , , );// Display ...
- vue经验 - 那些自己给自己挖的深坑
深坑场景:vue-异步请求数据,数据还没回来,页面却如饥似渴的准备好了的尴尬场景:问题原因和解决如下: 1.先说vuex中的store,一开始我为了偷懒是这么设置的,如下图: 然后我到了组件中直接这么 ...
- HTTP协议剖析 (附HttpWatch工具监控网络请求)
工具:HttpWatch Prov7.2.13破解版(带正版key) HTTP协议概述 思考2个要点: 第一:浏览器和服务器是通过什么连接的 第二:这种连接方式是怎么实现的 通过Interne ...
- call()、apply()和bind()的异同
相同点: 改变this的指向: var a = { name:"丸子", fn:function(){ console.log(this.name); } } var b = a. ...
- 第四步 使用 adt-eclipse 打包 Cordova (3.0及其以上版本) + sencha touch 项目
cordova最新中文api http://cordova.apache.org/docs/zh/3.1.0/ 1.将Cordova 生成的项目导入到adt-eclipse中,如下: 项目结构如下: ...
- 硬件RDMA的驱动配置和测试
author:headsen chen date: 2019-01-18 10:22:20 notice:created by headsen chen himself and not allow ...
- 解决使用Foxmail客户端软件不能收取腾讯企业邮箱的全部邮件
一般说来,使用Foxmail客户端软件收取邮箱时,需要作如下几步: 1.进入邮箱web界面授权开启POP3/SMTP服务.IMAP/SMTP等服务 2.在邮箱web界面配置收取选项,可选择收取全部邮件 ...
- iOS - 去除数组中重复数据的几种方法
第一种:利用NSDictionary的AllKeys(AllValues)方法 代码: NSArray *dataArray = @[@"2018-02-01",@"20 ...