iframe中对滚动条设置的注意事项

最新推荐文章于 2023-11-04 10:19:26 发布
最新推荐文章于 2023-11-04 10:19:26 发布
阅读量2.8k 收藏
点赞数
文章标签： iframe 框架
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/guilin_gavin/article/details/2326650
版权
      使用iframe的时候，使用noresize可以控制该框架不能被用户改变大小；而scrolling则用于设置框架每个部分是否使用滚动条，其可选值如下：yes 显示滚动条；no 不显示；auto根据需要显示。但这里有一点需要注意的情况是，对于iframe的滚动条来说，是没有办法对水平或者垂直方向的滚动条进行单独设定的，这两个滚动条是一起进行设定的，所以，有的时候就会出现，一但垂直方向出现了滚动条，则水平方向虽然没有超出页面宽度，同样也会出现滚动条的问题！
guilin_gavin
关注
html5 iframe 无法滚动条,iframe嵌入的页面没有滚动条
weixin_31569663的博客
06-10 7815
怎么样iframe没有滚动条 页面有滚动条iframe没有滚动条 scrolling="No"这个去掉了但是页面超过了屏幕，应该有不是到你只什么意思哦frameborder="0" align="top" scrolling="yes" src=""这样可以设置有滚动条BODY { SCROLLBAR-FACE-COLOR:#fdce75; SCROLLBAR-HIGHLIGHT-COLOR: #...
在iframe中隐藏横向滚动条的方法大全
10-31
### 在iframe中隐藏横向滚动条的方法大全 #### 概述 在网页开发中，经常会用到`<iframe>`标签来嵌入其他页面或内容。然而，有时候这些嵌入的内容可能会导致横向滚动条出现，影响用户体验及整体美观度。本文将详细...
iframe 上下滚动条如何默认在下方实现原理
12-12
问题：iframe 上下滚动条如何默认在下方，做的是聊天工具，数据多了，每次刷新出现的上下滚动默认在上方，还需下拉到下面才能看到聊天记录，有办法让它出现在下方吗? 答案：直接在iframe里写window.scrollTo(0,9999999)或者设置div等容器的scrollTop 代码如下: document.getElementById(“x”).scrollTop = document.getElementById(“x”).scrollHeight window.scrollTo(0,9999999) 这个是解决了在下方，但是有新信息后，滚动条不会自动到下方，我是希望像qq聊天窗
iframe自适应父页面的大小，而没有滚动条，scrolling="no"后无法正常显示内容的问题
热门推荐
m0_38138387的博客
03-30 2万+
今天做网站遇到了一个问题，iframe的scrolling="no"设置后，无法显示全部iframe内容，判断是内容隐藏了，一顿好找，在网上找到了这编文章，问题解决转】让iframe自适应大小，没有滚动条 (2011-05-26 09:01:00)转载▼标签： 杂谈 父页里有一个层&lt;div&gt;，&lt;div&gt;里有一个子框架&lt;iframe&gt;,&lt;iframe&gt;...
ios端 尝试解决 iframe层无法滚动,及iframe宽度变宽的问题
qq_41074373的博客
06-12 4979
最近在项目中，使用iframe层展示商品详情。于是将网页嵌在了iframe标签里面，在PC测试没有问题，自适应良好，但是转入IOS 真机中，iframe 却不能很好地适应屏幕大小，总是超出屏幕尺寸，也无法上下左右滚动查看完整页面。1、iframe无法滚动：（使用一个div将iframe包含起来，给该div设置一下class）.scroll-wrapper { -webkit-ove...
Iframe的滚动条操作
dcke31608的博客
12-30 338
（某些样式需ie5.5+才能支持）： 1．overflow内容溢出时的设置（设定被设定对象是否显示滚动条） overflow-x水平方向内容溢出时的设置 overflow-y垂直方向内容溢出时的设置 以上三个属性设置的值为visible(默认值)、scroll、hidden、auto。 2．scrollbar-...
完全搞定iframe（框架）里的滚动条.doc
08-22
### 完全搞定iframe（框架）里的滚动条 #### 知识点概览 ...通过对不同场景下iframe滚动条问题的理解以及采用合理的CSS或JavaScript技术，可以有效地解决在A页面中加载B页面时出现的滚动条问题，提升用户体验。
iframe src为图片时的高度自适应的代码
10-30
- 获取iframe内部body的样式，设置`margin`和`padding`为0，确保不会因为默认的间距而产生滚动条。 - 创建并初始化img元素，设置其`src`属性为iframe的`src`属性。 - 读取img元素的`height`和`width`，并赋值给...
jQuery简单实现iframe的高度根据页面内容自适应的方法
10-21
然而，`iframe`中的内容高度可能不固定，如果不能自适应调整，可能会导致滚动条异常或者页面显示不完整。这时，我们可以利用jQuery来解决这个问题，让`iframe`的高度根据其内部页面内容自动调整。本篇文章将详细介绍...
通过ifame指向的页面高度调整iframe的高度
12-10
标题提到的问题是关于如何动态调整`iframe`的高度以适应其内部内容的高度，以避免滚动条的出现或者内容被截断。以下将详细解释这个过程。 1. **`iframe`基本结构**： `iframe`标签用于创建一个独立的浏览器窗口，...
移动端iframe跳转第三方应用出现无法滑动问题
weixin_44748107的博客
03-11 4871
问题 为了实现跨平台兼容，我们的项目用的是capacitor+vue框架，实际上就是在webview上用iframe实现页面的跳转功能，ios在跳转到第三方页面时，出现了无法滑动的情况。 由于iframe在ios上宽度撑开屏幕问题，设置了iframe的scrolling为no，因此才会出现无法滑动问题。 解决办法 由于不能直接改iframe，于是我们选择迂回救国，通过调用内置浏览器访问第三方页面。 capacitor内置浏览器open() 通过调用调用capacitor的内置浏览器打开第三方页面，但是该浏
iframe 滚动条的问题
L-BAKE
12-21 896
<br />对于IE浏览器：在js里面添加对iframe的控制  document.getElementById("frame1").scrolling="yes";  是无效的；<br />而在火狐浏览器是 起作用的。 代码如下：<br /><html> <head> <mce:script type="text/javascript"><!-- function addScrollbars() { document.getElementById("frame1").scrolling=
iframe不显示滚动条并且设置动态高度、添加内部样式和脚本
最新发布
生而为人我很抱歉
11-04 900
【代码】iframe不显示滚动条并且设置动态高度、添加内部样式和脚本。
IFRAME滚动条的样式
Monkey Space
04-20 959
一、预览效果：二、代码Test.htmlTest1.htmlBODY {}{ SCROLLBAR-FACE-COLOR: #e8e7e7;  SCROLLBAR-HIGHLIGHT-COLOR: #ffffff;  SCROLLBAR-SHADOW-COLOR: #ffffff;  SCROLLBAR-3DLIGHT-COLOR: #cccccc;  SCROLLBAR-ARR
关于iframe滚动条的显示控制问题
weixin_30629977的博客
11-24 173
引自：http://webkafa.blog.163.com/blog/static/17483446320081151010723/ 问题描述： 最近在做项目的时候，使用了iframe来控制页面显示。发现当iframe指向的页面高度大于iframe高度，而页面宽度小于iframe宽度时，会同时出现水平和垂直滚动条。正常情况，应该只出现垂直滚动条，只有页面宽度大于iframe宽度时，才...
HTML IE iframe 始终显示垂直滚动条
weixin_30278311的博客
09-15 209
注意： IFrame在Firefox，google 浏览器中，只要overflow-x:hidden;overflow-y:scroll就可以解决 但是在IE内，XP和W98等版本中，不同版本浏览器下会出现一些差异，无法实现始终显示一个垂直或水平的滚动条 总之IE内，IFrame往往是要么横纵滚动条一起显示，要么全部不显示，没有其他的选择 解决方案： 可以通过IFrame内部嵌套div的...
解决iframe滚动条问题
tony的专栏
01-12 2195
解决方案一： 去掉文件开头的文档声明。不使用"DOCTYPE "文档声明(详细代码在下面)的话很容易就过去了。但是不使用文档声明，一是代码不规范，二是不能获得文档的高度。 下面的代码执行的结果是pageHeight=160px;，而实际上B文件的高度（长度）是800px左右。var pageHeight = (document.body.clientHeight?document.body
隐藏iframe滚动条，并禁止滑动
weixin_45559449的博客
03-20 7705
当我们通过 iframe 展示图片，或是通过 iframe 展示 PDF文件 时，如果图片和 PDF 超出 iframe设置的宽高，就会出现横纵向的滚动条，如下图。所以， iframe 展示图片时可以通过设置 scrolling=“no” 属性来隐藏滚动条，iframe 展示 PDF文件时 设置 scrolling=“no” 属性并不能隐藏滚动条。如果 iframe 存在纵向滚动条，则 iframe宽度=原宽度+滚动条宽度，即width: calc(100% + 17px)；
iframe去掉双滚动条
qq_43437571的博客
08-03 1920
出现的问题： 页面一个滚动条，iframe引用的内容里有一个滚动条，非常难看。 去掉双滚动条 实现思想： 子页面（即被引用页面）通过posyMessage把高度传给父页面（即引用页面，有iframe），父页面接收高度，重置本页面高度。 代码如下： 子页面： <div ref="son1"> <ul> <li>多写一点，增加高度</li><!-- 多写一点，增加高度 --> </ul> </div> mou
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值