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


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中链式调用之研习
Apr 07 Javascript
Jquery Uploadify上传带进度条的简单实例
Feb 12 Javascript
JavaScript控制按钮可用或不可用的方法
Apr 03 Javascript
基于Jquery代码实现手风琴菜单
Nov 19 Javascript
js判断移动端是否安装某款app的多种方法
Dec 18 Javascript
jQuery Easyui datagrid/treegrid 清空数据
Jul 09 Javascript
JavaScript用JSONP跨域请求数据实例详解
Jan 06 Javascript
angular 动态组件类型详解(四种组件类型)
Feb 22 Javascript
快速解决vue动态绑定多个class的官方实例语法无效的问题
Sep 05 Javascript
解决vue项目中页面调用数据 在数据加载完毕之前出现undefined问题
Nov 14 Javascript
Element DateTimePicker日期时间选择器的使用示例
Jul 27 Javascript
JavaScript编码小技巧分享
Sep 17 Javascript
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
在WordPress中使用wp-cron插件来设置定时任务
2015/12/10 PHP
PHP大文件切割上传功能实例分析
2019/07/01 PHP
PHP中echo与print区别点整理
2021/03/09 PHP
JavaScript开发时的五个注意事项
2007/12/08 Javascript
js 替换功能函数,用正则表达式解决,js的全部替换
2010/12/08 Javascript
javascript回车完美实现tab切换功能
2014/03/13 Javascript
javascript设计模式之中介者模式Mediator
2014/12/30 Javascript
深入理解JavaScript系列(25):设计模式之单例模式详解
2015/03/03 Javascript
JS图片压缩(pc端和移动端都适用)
2017/01/12 Javascript
vue+vux实现移动端文件上传样式
2017/07/28 Javascript
Vue实现搜索 和新闻列表功能简单范例
2018/03/16 Javascript
nodejs之koa2请求示例(GET,POST)
2018/08/07 NodeJs
tracking.js页面人脸识别插件使用方法
2020/04/16 Javascript
node.js中npm包管理工具用法分析
2020/02/14 Javascript
js实现简单抽奖功能
2020/11/24 Javascript
python动态性强类型用法实例
2015/05/09 Python
Python基础入门之seed()方法的使用
2015/05/15 Python
Python的Django框架中模板碎片缓存简介
2015/07/24 Python
Python编程判断这天是这一年第几天的方法示例
2017/04/18 Python
Python对象类型及其运算方法(详解)
2017/07/05 Python
11月编程语言排行榜 Python逆袭C#上升到第4
2017/11/15 Python
PyQt5显示GIF图片的方法
2019/06/17 Python
教你一步步利用python实现贪吃蛇游戏
2019/06/27 Python
python 处理微信对账单数据的实例代码
2019/07/19 Python
Pycharm调试程序技巧小结
2020/08/08 Python
python tkinter实现下载进度条及抖音视频去水印原理
2021/02/07 Python
迪卡侬荷兰官网:Decathlon荷兰
2017/10/29 全球购物
美国高级工作服品牌:Carhartt
2018/01/25 全球购物
Nike爱尔兰官方网站:Nike.com (IE)
2018/03/12 全球购物
Jones New York官网:美国女装品牌,受白领女性欢迎
2019/11/26 全球购物
环境工程大学生自荐信
2013/10/21 职场文书
酒店led欢迎词
2014/01/09 职场文书
校庆接待方案
2014/03/18 职场文书
中班幼儿评语大全
2014/04/30 职场文书
十佳青年事迹材料
2014/08/21 职场文书
人事行政助理岗位职责
2015/04/11 职场文书