- 最近工作中遇到页面内嵌iframe滚动条去重的问题,由于项目中用到jq,就用jq解决 …….分享出来 。
- 外层html结构:
- <html style="overflow:hidden;">
- <ul>menu</ul>
- <div id="content" style="overflow:hidden;"><iframe src1="xxx.html" /></div>
- </html>
- #加入到iframe页面的js,可以加入到js文件,其他文件引用。
- /**
- * 完美解决iframe双滚动条显示
- * @author yangsen
- * @param iframeID
- * @param topOffset
- * @param leftOffset
- */
- function resizeFrame(frameId,topOffset,leftOffset) {
- document.body.style.overflow='scroll';
- document.body.style.overflowX='hidden';
- var parentDocEle = parent.document.documentElement;
- $("html").add("body").CSS({"overflow-x:":"hidden","overflow-y:":"scroll"});
- var newrectage ={'height':parentDocEle.clientHeight-topOffset,'width':parentDocEle.scrollWidth-leftOffset};
- var pcontent = parent.document.getElementById("content");
- $(pcontent).css({'height':newrectage.height+'px','width':newrectage.width+'px'});
- $(parent.document.getElementById(frameId)).css({'width':newrectage.width,'height':newrectage.height});
- }
- //init .
- $(parent).resize(function() {
- resizeFrame("ifrObj",76,240);
- });
- $(parent).resize();
- //该片段来自于http://www.codesnippet.cn/detail/220420149337.html
来源: http://www.codesnippet.cn/detail/220420149337.html