css隐藏滚动条依旧可以滚动

时间:2022-10-09 16:48:46

  在做企业页面的时候,大部分页面都应该是活的,不应该写死,因为要从后台拿数据进行填充。而后台的数据是不确定的,有时候会让我们的容器撑得很大。这时候我们需要隐藏掉滚动条达到美观或者其他布局效果,隐藏掉单个方向滚动条,例如: 隐藏Y轴滚动条 overflow-Y :hidden 但这样,会让我们的滚动元素变得不可滚动。百度测试了一下,以下该伪类可以实现既隐藏掉滚动条,又不会影响元素的滚动/滑动。这里的隐藏属于 display:none 类似效果,是不会影响布局的。如图:

css隐藏滚动条依旧可以滚动

css隐藏滚动条依旧可以滚动的更多相关文章

  1. 实现CSS隐藏滚动条并可以滚动内容

    隐藏滚动条的同时还需要支持滚动,我们经常在前端开发中遇到这种情况,最容易想到的是加一个iscroll插件,但其实现在CSS也可以实现这个功能,我已经在很多地方使用了,下面一起看看这三种方法. 方法1: ...

  2. 3种方法实现CSS隐藏滚动条并可以滚动内容

    隐藏滚动条的同时还需要支持滚动,我们经常在前端开发中遇到这种情况,最容易想到的是加一个iscroll插件,但其 实现在CSS也可以实现这个功能,我已经在很多地方使用了,下面一起看看这三种方法. 方法1 ...

  3. CSS实现隐藏滚动条并可以滚动内容

    方法一: 计算滚动条宽度并隐藏起来,其实我只是把滚动条通过定位把它隐藏了起来,下面给一个简化版的代码: <div class="outer-container"> &l ...

  4. css隐藏滚动条

    xhtml中隐藏滚动条在用ie6浏览有框架的xhtml页面的时候,默认会水平和垂直滚动条会一起出现,这是ie6的一个bug,在firefox上是正常的,出现的原因是其对XHTML 1.0 transi ...

  5. css 隐藏滚动条

    如何使用css隐藏滚动条 如何隐藏滚动条,同时仍然可以在任何元素上滚动? 首先,如果需要隐藏滚动条并在内容溢出时显示滚动条,只需要设置overflow:auto样式即可.想要完全隐藏滚动条只需设置ov ...

  6. 纯css实现隐藏滚动条仍可以滚动

    移动端弹出层加了滚动条之后,滚动条一直在,有些不美观,overflow:hidden;虽然可以隐藏滚动条,但是不能滚动.需要实现隐藏滚动条但是仍可以滚动,js实现太麻烦,直接将滚动条隐藏会更好一些. ...

  7. 如何让css隐藏滚动条 兼容谷歌、火狐、IE等各个浏览器

    项目中,页面效果需要展示一个页面的移动端效果,使用的是一个苹果手机样式背景图,咋也没用过苹果,咋也不敢形容. 如下图所示: 在谷歌浏览器如图一滚动条顺利隐藏,但是火狐就如图二了,有了滚动条丑的一批. ...

  8. css隐藏滚动条 兼容谷歌、火狐、IE等各个浏览器

    项目中,页面效果需要展示一个页面的移动端效果,使用的是一个苹果手机样式背景图,咋也没用过苹果,咋也不敢形容. 如下图所示: 在谷歌浏览器如图一滚动条顺利隐藏,但是火狐就如图二了,有了滚动条丑的一批. ...

  9. 如何使用CSS隐藏滚动条并且兼容大部分浏览器

    隐藏滚动条,已经自己实测在浏览器Chrome, IE (6+), Firefox, Opera, Safari. 如下demo: Content 1 Content 1 Content 1 Conte ...

随机推荐

  1. Android 手机卫士--自定义属性

    在前面的文章中,已经实现了“设置中心”第一栏的功能以及布局 本文地址:http://www.cnblogs.com/wuyudong/p/5936016.html,转载请注明出处. 自定义属性声明 接 ...

  2. scrollview做定时来回滚动时,总出现错位的情况。

    方法1:self.edgesForExtendedLayout = UIRectEdgeNone; 方法2:    self.automaticallyAdjustsScrollViewInsets ...

  3. 解决死锁SQL

    USE [master]GO/****** Object: StoredProcedure [dbo].[p_lockinfo] Script Date: 04/03/2014 15:12:40 ** ...

  4. Cent OS 6&period;4安装mysql

    Cent OS6.4 RPM安装mysql 一.卸载掉原有mysql 因为目前主流Linux系统版本基本上都集成了mysql数据库在里面 如下命令来查看我们的操作系统上是否已经安装了mysql数据库 ...

  5. kindEditort图片自动上传

    参考:http://www.cnblogs.com/jaxu/p/3824583.html (赞一个)

  6. 在VC&plus;&plus;中启用内存泄露检测

    检测内存泄漏的主要工具是调试器和 CRT 调试堆函数.若要启用调试堆函数,请在程序中包括以下语句: #define CRTDBG_MAP_ALLOC#include <stdlib.h># ...

  7. setTimeout&comma;setInterval 最短触发时间

    <!DOCTYPE html> <html> <head> <title></title> </head> <body&g ...

  8. 解决cpplint在Python 3下没有任何输出的问题

    修改cpplint.py:1. main()中注释掉  # sys.stderr = codecs.StreamReaderWriter(sys.stderr,  # codecs.getreader ...

  9. ARM 汇编指令 DCD

    简介 DCD:数据定义( Data Definition )伪指令 一般用于为特定的数据分配存储单元,同时可完成已分配存储单元的初始化. 语法格式: 标号 DCD(或 DCDU) 表达式 DCD(或 ...

  10. 【poj3718】 Facer&&num;39&semi;s Chocolate Dream

    http://poj.org/problem?id=3718 (题目链接) 题意 给出${2}$个长度为${n}$的${01}$串,问是否存在${m}$个长度为${n}$的有三个位置为${1}$的$0 ...