美文网首页
iframe操作父级页面事件-window.parent.doc

iframe操作父级页面事件-window.parent.doc

作者: web小哥MrYang | 来源:发表于2020-03-27 01:13 被阅读0次

需求:在模式无障碍情况下放大后出现横向滚动条并且居中显示

收获:1.给iframe的父级元素绑定事件

$('#cy_zoomAdd', window.parent.document).on("click",function(){//给iframe的父级元素绑定事件

            $('body', window.parent.document).css({ "overflow-x": "auto" })

            //给父级html加属性---window.parent.document

           $("body").css({ "height": "9.5rem", "overflow": "hidden", "zoom": "1" });

            //给自身iframe加属性

}) 

2.横向滚动条居中(滚动条居中思路)

<1 .思路最开始设置滚动条左侧给一个非常大的值这样滚动条就会置顶右侧然后获取左侧的滚动条距离除以2这样赋值进去左侧距离就可以实现横向滚动条居中-------兼容iE火狐

$(document).scrollLeft(100000);

$(document).scrollLeft($(document).scrollLeft()/2)

<2 直接写就行-----   一般在谷歌兼容性比较好的都没有问题

$(document).scrollLeft(($(document).width() - document.body.scrollWidth) / 2);//滚动条偏移

<3 思路:横向滚动条居中=(整个页面文档的宽度-浏览器可视窗口的宽度)/2----就是超出一屏的内容宽度除以2

相关文章

网友评论

      本文标题:iframe操作父级页面事件-window.parent.doc

      本文链接:https://www.haomeiwen.com/subject/xgkkuhtx.html