iframe无滚动条,内容可滚动
程序员文章站
2022-04-18 18:37:33
...
不跨域情况下给iframe加载的document添加mousewheel事件,自己设置document.body/document.documentElement的scrollTop进行滚动
跨域没搞。。只能设置scrolling="auto"或者yes
<iframe scrolling="no" style="width:100%;height:300px;border:solid 1px #000" src="x.html" onload="bindMouseWhee(this)"></iframe>
<script>
var firefox = navigator.userAgent.indexOf('Firefox') != -1;
function MouseWheel(e,doc) {
e.preventDefault && e.preventDefault(), e.returnValue = false;
var up = firefox && e.detail < 0 || e.wheelDelta > 0;
doc.body.scrollTop = doc.documentElement.scrollTop += up ? -50 : 50;//每次滚动50px
}
function bindMouseWhee(ifr) {
try {
var doc = ifr.contentWindow.document;
firefox ? doc.addEventListener('DOMMouseScroll', function (e) { MouseWheel(e,doc)}, false) : (doc.onmousewheel = function (e) {MouseWheel(e||ifr.contentWindow.event,doc) });
}
catch (e) { alert('跨域无法获取iframe加载document'+e)}
}
</script>
下一篇: 左侧滚动无滚动条