HTML - 隐藏滚动条但可以滚动
代码：（原理就是遮盖）
1、如果你把子div的140px宽度移除，你就明白其中的奥妙了。
2、原理就是父元素负责滚动，子元素负责遮盖。
<html>
<style>
.scroll{
overflow-x: hidden; overflow-y: auto;
}
.scroll-son{
overflow-x: hidden;
}
</style> <div style="height: 300px; width: 120px; background:red" class="scroll">
<div style="height:100%; width: 140px;" class="scroll-son">
<p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p><p>1</p>
</div>
</div> </html>
HTML - 隐藏滚动条但可以滚动的更多相关文章
- 实现CSS隐藏滚动条并可以滚动内容
隐藏滚动条的同时还需要支持滚动,我们经常在前端开发中遇到这种情况,最容易想到的是加一个iscroll插件,但其实现在CSS也可以实现这个功能,我已经在很多地方使用了,下面一起看看这三种方法. 方法1: ...
- 纯css实现隐藏滚动条仍可以滚动
移动端弹出层加了滚动条之后,滚动条一直在,有些不美观,overflow:hidden;虽然可以隐藏滚动条,但是不能滚动.需要实现隐藏滚动条但是仍可以滚动,js实现太麻烦,直接将滚动条隐藏会更好一些. ...
- 3种方法实现CSS隐藏滚动条并可以滚动内容
隐藏滚动条的同时还需要支持滚动,我们经常在前端开发中遇到这种情况,最容易想到的是加一个iscroll插件,但其 实现在CSS也可以实现这个功能,我已经在很多地方使用了,下面一起看看这三种方法. 方法1 ...
- CSS实现隐藏滚动条并可以滚动内容
方法一: 计算滚动条宽度并隐藏起来,其实我只是把滚动条通过定位把它隐藏了起来,下面给一个简化版的代码: <div class="outer-container"> &l ...
- css隐藏滚动条依旧可以滚动
在做企业页面的时候,大部分页面都应该是活的,不应该写死,因为要从后台拿数据进行填充.而后台的数据是不确定的,有时候会让我们的容器撑得很大.这时候我们需要隐藏掉滚动条达到美观或者其他布局效果,隐藏掉单个 ...
- HTML5 元素超出部分滚动, 并隐藏滚动条
方法一, 利用 css 3 的新特性 -webkit-scrollbar, 但是这种方式不兼容 火狐 和 IE <!DOCTYPE html> <html> <head ...
- CSS 实现隐藏滚动条同时又可以滚动（转）
CSS 实现隐藏滚动条同时又可以滚动 移动端页面为了更接近原生的体验,是否可以隐藏滚动条,同时又保证页面可以滚动? 使用 overflow:hidden 隐藏滚动条,但存在的问题是:页面或元素失去了滚 ...
- CSS元素超出部分滚动，并隐藏滚动条
方法一, 利用 css 3 的新特性 -webkit-scrollbar, 但是这种方式不兼容 火狐 和 IE <!DOCTYPE html> <html> <head ...
- CSS隐藏overflow默认滚动条同时保留滚动效果
主要应用于移动端场景,仿移动端滚动效果.对于隐藏滚动条,众所周知overflow:hidden,但是想要的滚动效果也没了. 所以对于移动端webkit内核提供一个伪类选择器: .element::-w ...
随机推荐
- 输错密码？这个 sudo 会“嘲讽”你
导读 你在 Linux 终端中会有很多的乐趣.我今天要讲的不是在终端中跑火车.我今天要讲的技巧可以放松你的心情.你学习过如何在命令行中增加 sudo 命令的超时,今天的文章中,我会向你展示如何让 su ...
- windows、linux mysql部署
阅读目录: 1.Windows下安装MySQL 2.Linux下安装MySQL 序章: MySQL是个小型的数据库,用来自己做小项目,做学习练习什么的再适合不过了,不过新手总会被一些莫名奇妙的问题难住 ...
- 连接SDE空间数据库——SQL Server篇
一.软件配置 要从 ArcMap 连接至 SQL Server 中的数据库或地理数据库,请在 ArcMap 计算机上安装 SQL Server native client 或 Microsoft OD ...
- 如何自定义CollectionView中每个元素的大小和间距
问题: 让每个元素大小变为104 x 104 Step 1: 在你的视图控制器头文件中实现UICollectionViewFlowLayout协议 eg: @interface XXViewContr ...
- CheeseZH: Stanford University: Machine Learning Ex3: Multiclass Logistic Regression and Neural Network Prediction
Handwritten digits recognition (0-9) Multi-class Logistic Regression 1. Vectorizing Logistic Regress ...
- 【CSWS2014 Summer School】深度问答技术及其在搜索中的应用-马艳军
Title: 深度问答技术及其在搜索中的应用 马艳军博士, 百度 Abstract: 深度问答(DeepQA)是一种基于对自然语言深度理解的智能问答技术,其核心技术涉及知识图谱建设.语义表示和计算.语 ...
- Hibernate(十一)检索
一.Hibernate检索策略 二.检索方法 三.get和load比较 get和load的区别: get不支持延迟加载,而load支持. 当查询特定的数据库中不存在的数据时,get会返回null, ...
- Java从零开始学二十九(大数操作（BigIntger、BigDecimal)
一.BigInteger 如果在操作的时候一个整型数据已经超过了整数的最大类型长度long的话,则此数据就无法装入,所以,此时要使用BigInteger类进行操作. 不可变的任意精度的整数.所有操作中 ...
- RPM 命令大全
RPM 大全RPM 有五种基本的操作方式(不包括创建软件包): 安装, 卸载, 升级, 查询,和验证. 下面我们就来逐一的讲解吧. 一. 安装RPM包 RPM 软件包通常具有类似foo-1.0-1.i ...
- pushlet单播与多播
近期要弄一个消息推送的功能,在网上找了非常多的关于pushlet的文章,尽管写的都非常具体,可是本人看了以后却总认为是模棱两可···不知道怎样下手,终于參考了这些文章中的一些内容,并结合官网的源码.做 ...