iframe关于滚动条的去除和保留
iframe嵌入页面后,我们有时需要调整滚动条,例如,去掉全部的滚动条,去掉右边的滚动条且保留底下的滚动条,去掉底下的滚动条且保留右边的滚动条。那么我们应该怎么做呢?
一:去掉全部的滚动条
第一个方法: iframe 有一个scrolling属性,它有 auto , yes , no 这三个值。
scrolling : auto -----在需要的时候滚动条出现
scrolling : yes ------始终显示滚动条
scrolling : no -------始终隐藏滚动条
当设置 scrolling : no 时,全部的滚动条就没有了。
第二个方法:我发现除了 scrolling 可以去掉全部的滚动条外,还有另一个方法,在嵌入的页面里设置 body{overflow:hidden},这样也可以将滚动条去掉,而且这也是当我们只想去掉某一个滚动条所使用的属性。
二:去掉右边的滚动条且保留底下的滚动条
如果只想保留底下的滚动条,那么可以在嵌入的页面里设置 body{overflow-x:auto ; overflow-y:hidden;}
三:去掉底下的滚动条且保留右边的滚动条
在嵌入的页面里设置 body{overflow-x:hidden;overflow-y:auto;}
我们已经知道了这两个属性都可以设置滚动条的显示和隐藏,那么当两个同时设置时,会出现哪个效果呢?
通过检测,我发现当 scrolling = " auto " 或者 " yes " 时,如果设置了 body,那么就会使用body里的设置;当 scrolling = " no " 时,不管body设置了什么,都会使用 scrolling 的设置,即全部的滚动条都被去掉了。
iframe关于滚动条的去除和保留的更多相关文章
- 关于iframe的滚动条,如何去掉水平滚动条或垂直滚动条
关于iframe的滚动条,如何去掉水平滚动条或垂直滚动条 关于<iframe>可以通过设置属性scrolling="no" 去掉iframe的两个滚动条. 如何只去掉水 ...
- iframe显示滚动条
子页面通过iframe加载,出现了竖向滚动条 最后查出原因:文档申明 iframe有滚动条的页面的文档申明 <!DOCTYPE html> 改成如下就行了 <!DOCTYPE HTM ...
- IE8以下版本iframe出现滚动条和内容空白问题
在网页中使用iframe引用了第三方的页面 $("#tianqi").html('<iframesrc="http://i.tianqi.com/index.php ...
- 去掉iframe默认滚动条后影响正常滚动以及js解决高度自适应。
对于iframe,相信大家都是知道存在很多弊端,比如说不利于搜索引擎的抓取:产生冗余结构体系不易管理等.不过在漫长的开发路上有时候使用是不可避免的. 前两天在做一个退弹的功能的时候使用了iframe, ...
- 遇到的有关iframe的滚动条问题
今天才发现一个简单有趣的问题,有关iframe的: <div style="height: 800px;overflow: auto;"> <iframe src ...
- css溢出滚动条及去除滚动条的方法
<div class="father"> <div class="childern"></div> </div> ...
- iframe子元素相对于父页面滚动条固定(iframe无滚动条,iframe固定高度有滚动条,两种情况)
一.当iframe自适应高度,无滚动条时候: 例如这样: //随着父页面滚动条滚动定位“#qn-quc”他的位置固定在顶部 $(parent.window).scroll(function() { v ...
- IOS中iframe的滚动条不启作用
引自:https://www.cnblogs.com/weinan/archive/2013/01/05/2832800.html 问题描述: iframe设置了高度(例如500px).倘若ifram ...
- Iframe去掉滚动条
<html><head><title></title></head><body STYLE='OVERFLOW:SCROLL;OVER ...
随机推荐
- Android中Fragment的两种创建方式
fragment是Activity中用户界面的一个行为或者是一部分.你可以在一个单独的Activity上把多个Fragment组合成为一个多区域的UI,并且可以在多个Activity中再使用.你可以认 ...
- Linux的学习笔记
Linux,1991年,系统安全,良好的可移植性,多用户,多任务,良好的兼容性,良好的用户界面, 主流的是RedHat或者CentOS, CentOS 设置的网关 192.168.2.2 Window ...
- Lesson 14 Do you speak English?
Text I had an amusing experience last year. After I had left a small village in the south of France. ...
- ABP(现代ASP.NET样板开发框架)系列之13、ABP领域层——数据过滤器(Data filters)
点这里进入ABP系列文章总目录 基于DDD的现代ASP.NET开发框架--ABP系列之13.ABP领域层——数据过滤器(Data filters) ABP是“ASP.NET Boilerplate P ...
- idea怎么设置自己的名字和时间
1.直接修改idea64.exe.vmoptions 里面添加上 -Duser.name=yourname 重启即可生效 1.file - settings-Editor- File and Code ...
- 2、摘要函数——MD2/MD4/MD5数字签名
摘要是用来防止数据被私自改动的方法,其中用到的函数叫做摘要函数.这些函数的输入可以是任意大小的信息,但是输出是大小固定的摘要.摘要有个重要的特性:如果改变了输入信息的任何内容,即使改变一位,输出也将发 ...
- PPT转化成Image、PPTX、XPS、EMF
最近工作经常用到演示文稿,接触到了一款不错的免费软件—Free Spire.Presentation.使用之后发现这款软件非常轻巧,功能还挺齐全.这款软件的转化功能也是非常不错的,平时遇到的各种转换难 ...
- GIS部分理论知识备忘随笔
文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/ 1.高斯克吕格投影带换算 某坐标的经度为112度,其投影的6度带和3度带 ...
- Spring Bean的生命周期(非常详细)
Spring作为当前Java最流行.最强大的轻量级框架,受到了程序员的热烈欢迎.准确的了解Spring Bean的生命周期是非常必要的.我们通常使用ApplicationContext作为Spring ...
- 从273二手车的M站点初探js模块化编程
前言 这几天在看273M站点时被他们的页面交互方式所吸引,他们的首页是采用三次加载+分页的方式.也就说分为大分页和小分页两种交互.大分页就是通过分页按钮来操作,小分页是通过下拉(向下滑动)时异步加载数 ...