正文

js把div固定在页面的右下角

IP云
IP云V管理员/4 阅读
06/17
提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

在公司做材料系统中，需要做一个总是居于右下角的div，但是因为右边这部分本就是用iframe做的，所以是不好弄的。

一开始，以为用position：fixed，一句css就可以完成，结果在iframe里面这个单页面倒是可以做到，但是一旦有加上模版页面，嵌在iframe中，就不行了。

所以不断搜索啊，问度娘，看到了这个，

      

<script type="text/javascript">
window.onscroll= window.onresize = window.onload = function (){
var getDiv = document.getElementById('rightBottom');
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;getDiv.style.left= document.documentElement.clientWidth - getDiv.offsetWidth+'px';
getDiv.style.top = document.documentElement.clientHeight-getDiv.offsetHeight +scrollTop +'px';
}</script>

但是因为我们是嵌套在iframe中，所以我们找的肯定是夫级页面，所以，代码应该变成如下

window.parent.onscroll = window.parent.onresize = window.onload =function () {
var oFix_box = document.getElementById('select-panel');
var oscrollTop = window.parent.document.documentElement.scrollTop || window.parent.document.body.scrollTop;
oFix_box.style.top = oscrollTop + window.parent.document.documentElement.clientHeight - oFix_box.offsetHeight - + 'px';
$("#select-panel").stop(true,true).animate({ "top": top1 }, );
}