Heim >Web-Frontend >HTML-Tutorial >div块显示和iframe冲突_html/css_WEB-ITnose
div块显示和iframe冲突_html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 12:17:591600Durchsuche
<script> <br /> window.onload=function(){ <br /> var divObj=document.getElementById("rightDiv"); <br /> divObj.style.width=parseInt(document.body.offsetWidth)/3; <br /> divObj.style.height=document.body.offsetHeight; <br /> var isOverDiv=false; <br /> document.body.onmousemove=function(e){ <br /> var e=e||window.event; <br /> if(parseInt(divObj.style.width)>parseInt(document.body.offsetWidth)-parseInt(e.clientX)){ <br /> isOverDiv=true; <br /> divObj.style.display=''; <br /> } <br /> if(parseInt(divObj.style.width)<parseInt(document.body.offsetWidth)-parseInt(e.clientX)&&isOverDiv){ <br /> divObj.style.display='none'; <br /> } <br /> } <br /> <br /> } <br /> </script>
当我从iframe所在的区域移动到div的边界时，div块并没有显示，求大侠解决，如果大侠可以的话，也顺便可已解决下我下拉右侧滚动条时如何设置div不滑动，同时不闪烁
回复讨论(解决方案)
没办法，因为在iframe中移动时根本就没触发document.body.onmousemove，iframe有不同的区域空间，和父页是分开的
我主要的是想实现这个功能，并不一定需要document.body.onmousemove，只要能实现功能，用什么都可以的
下面的可以，不过无法操作iframe的内容，用透明浮动层浮动在iframe上面就可以出发了
一定要操作iframe那就没办法了，除非iframe是你自己的页面， 获取iframe中鼠标事件在父页的坐标位置
<html><head><script> window.onload = function () { var divObj = document.getElementById("rightDiv"); divObj.style.width = parseInt(document.body.offsetWidth) / 3; divObj.style.height = document.body.offsetHeight; var isOverDiv = false; document.body.onmousemove = function (e) { var e = e || window.event; if (parseInt(divObj.style.width) > parseInt(document.body.offsetWidth) - parseInt(e.clientX)) { isOverDiv = true; divObj.style.display = ''; } if (parseInt(divObj.style.width) < parseInt(document.body.offsetWidth) - parseInt(e.clientX) && isOverDiv) { divObj.style.display = 'none'; } } }</script></head><body><div ><div id='rightDiv' style="background:black; border:2px #FF0000 solid;position:absolute; z-index:10000; top:5px; right:0px; display:none; "></div><div style="width:100%;height:100%;position:relative"><div style="position:absolute;width:100%;height:100%;filter:alpha(opacity=0);opacity:0;background:#000"></div><iframe src="http://www.baidu.com" width="100%" ></iframe></div></div></body></html> Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：关于静态网页的缓存问题_html/css_WEB-ITnoseNächster Artikel：求一个漂亮的超时界面,........................_html/css_WEB-ITnose