当我们的内容超出了我们的div，往往会出现滚动条，影响美观。

尤其是当我们在做一些导航菜单的时候。滚动条一出现就破坏了UI效果。  我们不希望出现滚动条，也不希望超出去的内容被放逐，就要保留鼠标滚动的效果。

这里介绍一个简单的方法。

大体思路是在div外面再套一个div。这个div设置overflow:hidden。

而内容div设置 overflow-y: scroll;overflow-x: hidden;

然后再设置外层div的width小于内层div的width。

这个内层div其实是会出现滚动条的，所以不影响鼠标的滚动效果，而且我们看不到滚动条了。

内层div效果：

加了外层后的效果

怎么在overflow-y:sroll的情况下 隐藏滚动条的更多相关文章

  1. windows下隐藏磁盘分区

    在一定情况下有的人会想隐藏掉部分分区,比如双系统的情况 有两种方式 方法1: 删除盘符,适合在双系统的情况下隐藏掉另外一个系统相关的分区 请注意是删除盘符 不是删除分区 此电脑右键管理 点击磁盘管理 ...

  2. windows下隐藏磁盘分区（转）

    在一定情况下有的人会想隐藏掉部分分区,比如双系统的情况 有两种方式 方法1: 删除盘符,适合在双系统的情况下隐藏掉另外一个系统相关的分区 请注意是删除盘符 不是删除分区 此电脑右键管理 点击磁盘管理 ...

  3. 在使用NavigationController情况下的布局的Y轴的起始位置

    在有的时候,当一个ViewController被push进一个NavigationController的时候,view上会有一个高度为64的NavigationBar(除非主动隐藏了Navigatio ...

  4. js+jquery+html实现在三种不通的情况下，点击图片放大的效果

    js+jquery+html实现在三种不通的情况下,点击图片放大的效果. 三种情况分别是:图片的父元素宽高固定;  图片的宽高固定;  图片的父元素宽固定,高度不固定 第一种情况:图片的父元素宽高固定 ...

  5. 如何在删除ibdata1和ib_logfile的情况下恢复MySQL数据库

    昨天,有个朋友对公司内部使用的一个MySQL实例开启binlog,但是在启动的过程中失败了(他也没提,为何会失败),在启动失败后,他删除了ibdata1和ib_logfile,后来,能正常启动了,但所 ...

  6. 排版紧凑情况下IOS 浏览器的文字部分选中问题

    一.需求 一个每一项都是图文混排的列表页,在需要对其中的某一部分文字进行选中copy的时候,IOS个二货每次都是直接选中了整个列表项,无论怎么操作它的选框都没有办法做到部分选中. 这是我本周遇到遇到的 ...

  7. PHP通过加锁实现并发情况下抢码实现

    需求:抢码功能 要求: 1.特定时间段才开放抢码: 2.每个时间段放开的码是有限的: 3.每个码不允许重复: 实现: 1.在不考虑并发的情况下实现: function get_code($len){ ...

  8. Linux不重启的情况下添加硬盘

    众所周知,SATA和SCSI是支持热插拔的,但是新装了这类支持热插拔的驱动器,系统不会马上识别的,往往我们需要重启系统来识别,但是有另外一种方法可以很方面的让系统识别新的设备.作为系统管理员,需要了解 ...

  9. jquery Tab默认情况下自动切换

    <!DOCTYPE html><html lang="zh-CN"><head><meta http-equiv="Conten ...

随机推荐

  1. .net core EF Cde First

    注意事项记录: public class StudentsModel { /// <summary> /// 一定需要id /// 一般用model名称+id作为表主键 /// 或者直接用 ...

  2. poj1862

    一.题意:两个物体m1.m2相撞后会变成一个物体,这个物体的重量会变成2*sqrt(m1*m2).有n个物体,假设只会发生两两相撞,求最后剩下的最小重量. 二.思路:简单的贪心.越大的数开越多的次方, ...

  3. Kafka消费不到数据的特殊情况

    我大约是把kafka消费不到数据的特殊情况都经历了一遍了吧= =. kafka消费不到数据的原因,首先检查配置之类的,如是否设置了group.id,对应的topic是否正确等等,这些不多说. 下面是我 ...

  4. Google Authenticator(谷歌身份验证器)

    <!DOCTYPE html>Google Authenticator(谷歌身份验证器) ] Google Authenticator(谷歌身份验证器) Google Authentica ...

  5. Java中多线程并发体系知识点汇总

    一.多线程 1.操作系统有两个容易混淆的概念,进程和线程. 进程:一个计算机程序的运行实例,包含了需要执行的指令:有自己的独立地址空间,包含程序内容和数据:不同进程的地址空间是互相隔离的:进程拥有各种 ...

  6. MVC参数自动装配

    在拿到一个类型的所有属性以及字段的描述信息后,就可以通过循环的方式,根据这些数据成员的名字去QueryString,Form,Session,Cookie读取所需的数据了. 就是遍历参数,然后用反射遍 ...

  7. Spark on Yarn运行错误：Yarn application has already ended! It might have been killed or unable to launch application master

    Spark on Yarn模式运行错误: bin/spark-shell --master yarn --deploy-mode client #报错 ​ 查看8088页面上的工作日志 错误原因:在执 ...

  8. android中的Touch研究

    android中的事件类型分为按键事件和屏幕触摸事件,Touch事件是屏幕触摸事件的基础事件,有必要对它进行深入的了解. 一个最简单的屏幕触摸动作触发了一系列Touch事件:ACTION_DOWN-& ...

  9. popchain与对应poc的构造分析

    本文首发于:https://mp.weixin.qq.com/s?__biz=MjM5MTYxNjQxOA==&mid=2652850238&idx=1&sn=6f22d8ab ...

  10. PHP通过映射类查找类所在文件

    $reflectObj = new ReflectionClass(类名); $file_name = $reflectObj->getFileName(); var_dump($file_na ...