购买
下载掌阅APP,畅读海量书库
立即打开
畅读海量书库
扫码下载掌阅APP

1.15 实现iframe高度自适应

资深的网页设计人员对iframe控件一定不会陌生,虽然它已渐渐退出历史舞台,但对于某些特定的项目还不得不去使用它。在使用iframe控件过程中会遇到高度的问题,原因是由于被嵌套的页面长度不固定而迫使iframe控件显示出滚动条。这样不仅影响页面美观,还会给用户操作带来不便,于是自动调整iframe的高度就是必须要解决的问题。本例效果如图1.24所示。

图1.24 实现iframe高度自适应

下面看看如何借助jQuery框架实现iframe高度自适应的效果:

本例的关键首先是获取页面body元素的高度,然后判断该高度是否小于300,最终设定iframe的自适应高度值,具体代码参考第05~06行。

第06行的height()函数用于返回或设置匹配元素的高度,其语法如下:

提示: 使用height()函数时,如果没有规定长度单位,则使用默认的px单位。 BtyA43ufEY0FgI+jc17tFaaBkmKMzFNXMy1o0iHyomPFDWCbuPPmYoAO93Jl9FUk

点击中间区域
呼出菜单
上一章
目录
下一章
×