在公司做材料系统中,需要做一个总是居于右下角的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. C# Lambda Expressions 简介

    C# Lambda Expressions 简介 原文http://msdn2.microsoft.com/en-us/library/bb397687.aspx 翻译:朱之光 (larry1zhu@ ...

  2. 2010年山东省第一届ACM大学生程序设计竞赛 Balloons (BFS)

    题意 : 找联通块的个数,Saya定义两个相连是 |xa-xb| + |ya-yb| ≤ 1 ,但是Kudo定义的相连是 |xa-xb|≤1 并且 |ya-yb|≤1.输出按照两种方式数的联通块的各数 ...

  3. hdu 1536/1944 / POJ 2960 / ZOJ 3084 S-Nim 博弈论

    简单的SG函数应用!!! 代码如下: #include<iostream> #include<stdio.h> #include<algorithm> #inclu ...

  4. oracle的全文索引

    1.查看oracle的字符集 SQL> select userenv('language') from dual; USERENV('LANGUAGE') ------------------- ...

  5. lintcode :Count and Say 报数

    题目: 报数 报数指的是,按照其中的整数的顺序进行报数,然后得到下一个数.如下所示: 1, 11, 21, 1211, 111221, ... 1 读作 "one 1" -> ...

  6. *[codility]AscendingPaths

    https://codility.com/programmers/challenges/magnesium2014 图形上的DP,先按照路径长度排序,然后依次遍历,状态是使用到当前路径为止的情况:每个 ...

  7. [hackerrank]Manasa and Stones

    https://www.hackerrank.com/contests/w2/challenges/manasa-and-stones 简单题. #include<iostream> us ...

  8. ios开发--27个提升效率的iOS开源库推荐

    超长慎入列表: DZNEmptyDataSet(UI,空表格视图解算器) PDTSimpleCalendar(UI,drop-in日历组件) MagicalRecord(实施活跃记录模式的Core D ...

  9. 创业草堂之二十二:创业公司C类官员的职位说明书

    麻雀虽小,五脏俱全. 创业公司启航,三五十来个人.七八条枪,其中“C”字开头的官儿还真少不了 – CEO.CTO.COO.CFO.CMO.CIO.CCO.CLO.Chairman/Chairwoman ...

  10. 2014-9-17二班----7 web project

    package cn.rwkj.servlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServle ...