在公司做材料系统中,需要做一个总是居于右下角的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 }, );
}

js把div固定在页面的右下角的更多相关文章

  1. 控制div固定在页面的某个位置 ,用js感觉很麻烦 CSS更好一些

    CSS代码:<style type="text/css"> html,body { width:100%; height:100%; margin:0px; paddi ...

  2. 返回顶部的功能 div固定在页面位置不变

    1.你在网上搜索的时候,可能会搜索到div固定在页面上,不随滚动条滚动而滚动是用CSS写的,写法是position:fixed;bottom:0; 但是这个在iframe满地跑的页面实际开发中,有啥用 ...

  3. js实现div滚动条在页面刷新 滚动条位置固定

    思想:1.通过div的onscroll事件记录滚动条的scrollTop值,设置到document.cookie 2.页面加载时再读取document.cookie的值,设置给div的scrollTo ...

  4. DIV固定在页面某个位置,不随鼠标滚动而滚动

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org ...

  5. JS 实现DIV 滚动至顶部后固定

    JS 实现DIV 滚动至顶部后固定 <!DOCTYPE HTML> <html> <head> <meta charset="UTF-8" ...

  6. js或jquery实现点击某个按钮或元素显示div,点击页面其他任何地方隐藏div

    点击某个元素显示div,点击页面其他任何地方隐藏div,可用javascript和jquery两种方法实现: 一:javascript实现方法技巧<script>//定义stopPropa ...

  7. html通过css,js实现div悬浮效果总汇,如原生JS实现滚动到一定位置实现div悬浮

    在我们的实际开发中,经常会遇到页面中需要悬浮效果,比如最早的客服联系,对联悬浮广告等,今天为大家介绍一些如何实现div悬浮的效果. 传统的fixed实现: 通过css中的属性position参数设为f ...

  8. JS控制div跳转到指定的位置的解决方案总结

    总结一下自己在写这个需求遇到的问题,相信大家应该是经常遇到的.即要求滚轮滚动到指定的位置.先看下基本的解决方案. 1.给链接a加个#的方式来实现跳转.(锚点方法)这里直接贴下代码: html页面: & ...

  9. 【转载自W3CPLUS】如何将页脚固定在页面底部

    该文章转载自:W3CPLUS 大漠的文章 http://www.w3cplus.com/css/css-sticky-foot-at-bottom-of-the-page 以下为全文 作为一个Web的 ...

随机推荐

  1. Choosing Columns and Expressions to Index

    A key is a column or expression on which you can build an index. Follow these guidelines for choosin ...

  2. 1> Strut2 Mapping to MVC

    CONTROLLER—FILTERDISPATCHER We’ll start with the controller. It seems to make more sense to start th ...

  3. POJ 2499 Binary Tree(二叉树,找规律)

    题意:给一个这样的二叉树,每个节点用一对数(a,b)表示,根节点为(1,1).设父亲为(a,b),左儿子(a+b,b),右儿子(a,a+b). 给几组数据,(i,j),求从根节点到(i,j)节点需要向 ...

  4. Genymotion加载so出错解决方案

    通过网上所搜得出结论: Genymotion是x86的架构,而我们的so库是arm架构的 解决:安装Genymotion-ARM-Translation.zip 1.下载:http://pan.bai ...

  5. 典型重构3 (Try/Catch)

    Try/Catch 块过多 public Customer GetCustomer(string customerId) { try { var command = new SqlCommand(); ...

  6. cogs 自己出的题目 题解报告

    第一题很简单嘛,就是裸的动态树分治嘛 对于每一层的重心维护子树路径的信息和子树到上一层重心的点的信息 空间复杂度O(nlogn) 对于每一层我们按dis排序,之后记录军队数量的前缀和 查询的时候我们只 ...

  7. Java的登陆验证问题

    java中的登陆验证问题可以有多种方式进行验证,通过拦截器功能完成,可以通过过滤器功能完成,也可以简单的代码在JSP页面中单独完成,其中都 涉及到一个关键的验证步骤,这个验证原理ASP,PHP,JAV ...

  8. eclipse中的工程中有叉叉

    在eclipse中的工程中有叉叉,并且不是编译的错. 那么,让eclipse自己告诉你原因吧.菜单Window->Show View->Problems 然后就去解决相应的Problems ...

  9. WCF入门(五)---创建WCF服务

    使用Microsoft Visual Studio2012创建WCF服务,理解如下所有必要的编码,更好地创建WCF服务的概念,这里做一个简单的任务. 启动Visual Studio 2012. 单击新 ...

  10. java c# 加密与解密对照

    原文 java c# 加密与解密对照 最近一直烦恼,java , c# 加密的不同,然后整理了一下,留个备份的轮子: 其中在 java.c#加密转换时,最重要的是 IV 的确定,我常常用如下方法使得j ...