可以修改iframe的滚动条样式么.怎么改?

可以修改iframe的滚动条样式么.怎么改?,第1张

iframe的滚动条样式要IE6.0以上浏览器可以看!你上面的代码没有问题啊!!放到内嵌页应该可以吧!我没有试过!不过实在不行你可以用div+css+js来做!以前看见过这样的代码!

2、需要将iframe上面的scrolling属性的属性值设置为yes或者删除该属性这样引入的那个页面里面的滚动条就出来了,仅仅这样还是不行的,我们还要设置iframe的高度,以好完整的显示引入的那个页面,因为浏览器的大小不一或者说是频幕的大小不一,所以为了兼容所有显示屏iframe的高度就应该等于浏览器的高度。这样得到:var LouLanQiHeight = $(window).height()//得到浏览器的高度var LouLanQiWidth = $(window).width()//得到浏览器的宽度$('iframe').attr('height', LouLanQiHeight)//将iframe的高度设置为浏览器的高度$('iframe').attr('width', LouLanQiWidth)3、前两步完成了,看上去貌似应经没问题了,但是当你把浏览器缩小了之后就有点问题了,滚动条被遮盖了一小部分。或者缩小之后你再刷新下页面在扩大,你会发现浏览器扩大了,但是那个引入的页面还是保持在浏览器缩小后的尺寸,这是因为在你没有缩小浏览器的时候iframe的高度就等于浏览器的高度了,当你缩小后,iframe的高度还是等于之前扩大后浏览器的高度,所以就把一部分遮盖了,然而当你在缩小后的浏览器刷新一下,js就重新得到了此时浏览器的高度然后再赋值给ifranme的高度,这个时候iframe的高度就等于缩小尺寸后浏览器的高度了。而此时将浏览器放大后,iframe的高度还是等于原来缩小尺寸浏览器的高度,所以就显示不全了。这个时候我们就要用到window对象下的onresize事件,改事件是在浏览器的尺寸发生变化的时候触发。我们将得到浏览器高度的代码放在这个事件里面就可以解决以上问题了。因为它当你每次改变浏览器的尺寸的时候他多会触发这个事件,从而执行里面的语句,因此iframe的高度也得到了更新。。。

1、首先打开网站开发工具,新建一个HTML页面。

2、编写HTML代码,核心代码:<div class="iframe-wrap"><iframe src="iframe.html" class="iframe-box"></iframe></div>。

3、接着编写CSS代码,核心代码如下图所示。

4、在新建一个HTML页面(也就是需要嵌套的iframe页面),代码如下。

5、给iframe页面添加修饰样式核心代码:p{ height: 50pxline-height: 50pxfont-size: 16px}。

6、打开浏览器,浏览刚才制作的页面,测试效果(可以使用滚轮和键盘上下键进行测试) 可以发现页面上没有滚动条,而且iframe依然可以滚动。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/tougao/7755694.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-09
下一篇 2023-04-09

发表评论

登录后才能评论

评论列表(0条)

保存