多浏览器支持的右下角浮动窗口


Posted in Javascript onApril 01, 2010
<script> 
function $(id) 
{ 
return document.getElementById(id); 
} 
var LoginUI = !!window.LoginUI || {}; 
LoginUI.getViewportWidth = function(){ 
var width=0; 
if(document.documentElement && document.documentElement.clientWidth){ 
width=document.documentElement.clientWidth;} 
else if(document.body && document.body.clientWidth){ 
width=document.body.clientWidth;} 
else if(window.innerWidth){ 
width=window.innerWidth-18;} 
return width; 
} 
LoginUI.getViewportHeight = function() { 
var height=0; 
if(window.innerHeight){ 
height=window.innerHeight-18;} 
else if(document.documentElement&&document.documentElement.clientHeight){ 
height=document.documentElement.clientHeight;} 
else if(document.body&&document.body.clientHeight){ 
height=document.body.clientHeight;} 
return height; 
} 
LoginUI.getViewportScrollX = function(){ 
var scrollX=0; 
if(document.documentElement&&document.documentElement.scrollLeft){ 
scrollX=document.documentElement.scrollLeft;} 
else if(document.body&&document.body.scrollLeft){ 
scrollX=document.body.scrollLeft;} 
else if(window.pageXOffset){ 
scrollX=window.pageXOffset;} 
else if(window.scrollX){ 
scrollX=window.scrollX;} 
return scrollX; 
} 
LoginUI.getViewportScrollY=function() { 
var scrollY=0; 
if(document.documentElement&&document.documentElement.scrollTop){ 
scrollY=document.documentElement.scrollTop;} 
else if(document.body&&document.body.scrollTop){ 
scrollY=document.body.scrollTop;} 
else if(window.pageYOffset){ 
scrollY=window.pageYOffset;} 
else if(window.scrollY){ 
scrollY=window.scrollY;} 
return scrollY; 
} 
function scrollMsgTip() 
{ 
var t = LoginUI.getViewportHeight() + LoginUI.getViewportScrollY() - $("msgtip").offsetHeight; 
$("msgtip").style.top = t + "px"; 
$("msgtip").style.left = LoginUI.getViewportWidth() + LoginUI.getViewportScrollX() - $("msgtip").offsetWidth + "px"; 
} 
function scrollTip() 
{ 
scrollMsgTip() 
} 
window.onload = window.onscroll = scrollTip; 
</script>

以上是js代码,下面是浮动的窗口
<div style='position:absolute;top:0;left:0;width:300px;height:180px;border:3px double #AAA' id='msgtip'>dfddfdf</div>
Javascript 相关文章推荐
javascript继承之为什么要继承
Nov 10 Javascript
JavaScript 模式之工厂模式(Factory)应用介绍
Nov 15 Javascript
js使用setTimeout实现定时炸弹的方法
Apr 10 Javascript
JavaScript实现文本框中默认显示背景图片在获得焦点后消失的方法
Jul 01 Javascript
Jquery+Ajax+PHP+MySQL实现分类列表管理(下)
Oct 28 Javascript
ashx文件获取$.ajax()方法发送的数据
May 26 Javascript
浅谈jQuery中的eq()与DOM中element.[]的区别
Oct 28 Javascript
最基础的vue.js双向绑定操作
Aug 23 Javascript
jquery-file-upload 文件上传带进度条效果
Nov 21 jQuery
javascript实现前端成语点击验证
Jun 24 Javascript
bootstrap-closable-tab可实现关闭的tab标签页插件
Aug 09 Javascript
vue+iview分页组件的封装
Nov 17 Vue.js
js 多浏览器分别判断代码
Apr 01 #Javascript
JS 遮照层实现代码
Mar 31 #Javascript
js压缩工具 yuicompressor 使用教程
Mar 31 #Javascript
jQuery 遍历json数组的实现代码
Sep 22 #Javascript
Javascript load Page,load css,load js实现代码
Mar 31 #Javascript
Javascript Jquery 遍历Json的实现代码
Mar 31 #Javascript
jquery+json实现的搜索加分页效果
Mar 31 #Javascript
You might like
PHP 提取图片img标记中的任意属性的简单实例
2013/12/10 PHP
用 Composer构建自己的 PHP 框架之基础准备
2014/10/30 PHP
php抽象类使用要点与注意事项分析
2015/02/09 PHP
PHP abstract 抽象类定义与用法示例
2018/05/29 PHP
Centos7.7 64位利用本地完整安装包安装lnmp/lamp套件教程
2021/03/09 Servers
Javascript实现的分页函数
2007/02/07 Javascript
HTML DOM的nodeType值介绍
2011/03/31 Javascript
javascript 系统文件夹文件操作及参数介绍
2013/01/08 Javascript
JS判断客户端是手机还是PC的2个代码
2014/04/12 Javascript
js中日期的加减法
2015/05/06 Javascript
jquery实现华丽的可折角广告代码
2015/09/02 Javascript
JavaScript实现同时调用多个函数的方法
2015/11/09 Javascript
Javascript中prototype的使用详解
2016/06/18 Javascript
JS+CSS3制作炫酷的弹窗效果
2016/11/08 Javascript
Angular.js跨controller实现参数传递的两种方法
2017/02/20 Javascript
如何通过非数字与字符的方式实现PHP WebShell详解
2017/07/02 Javascript
input输入框内容实时监测(附代码)
2017/08/15 Javascript
在 Linux/Unix 中不重启 Vim 而重新加载 .vimrc 文件的流程
2018/03/21 Javascript
Node.js创建HTTP文件服务器的使用示例
2018/05/11 Javascript
php中and 和 &amp;&amp;出坑指南
2018/07/13 Javascript
json前后端数据交互相关代码
2018/09/19 Javascript
详解Angular中实现自定义组件的双向绑定的两种方法
2018/11/23 Javascript
小程序接口的promise化的实现方法
2019/12/11 Javascript
Vue中使用Lodop插件实现打印功能的简单方法
2019/12/19 Javascript
10分钟学会js处理json的常用方法
2020/12/06 Javascript
跟老齐学Python之关于循环的小伎俩
2014/10/02 Python
用Python编写脚本使IE实现代理上网的教程
2015/04/23 Python
Python selenium实现微博自动登录的示例代码
2018/05/16 Python
Python安装及Pycharm安装使用教程图解
2019/09/20 Python
wxPython电子表格功能wx.grid实例教程
2019/11/19 Python
使用Pandas的Series方法绘制图像教程
2019/12/04 Python
Python self用法详解
2020/11/28 Python
大学四年个人的自我评价
2014/02/26 职场文书
加油口号大全
2014/06/13 职场文书
医务人员医德考评自我评价
2015/03/03 职场文书
css背景和边框标签实例详解
2021/05/21 HTML / CSS