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


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传递变量: 值传递?引用传递?
Feb 22 Javascript
jQuery:节点(插入,复制,替换,删除)操作
Mar 04 Javascript
关于eval 与new Function 到底该选哪个?
Apr 17 Javascript
Jquery 返回json数据在IE浏览器中提示下载的问题
May 18 Javascript
原生javascript实现的一个简单动画效果
Mar 30 Javascript
bootstrap手风琴制作方法详解
Jan 11 Javascript
JS实现多级菜单中当前菜单不随页面跳转样式而发生变化
May 30 Javascript
mui 打开新窗口的方式总结及注意事项
Aug 20 Javascript
纯js实现画一棵树的示例
Sep 05 Javascript
jQuery选择器之子元素选择器详解
Sep 18 jQuery
Vue多系统切换实现方案
Jun 05 Javascript
vue 实现特定条件下绑定事件
Nov 09 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
异世界新番又来了,同样是从零开始,男主的年龄降到5岁
2020/04/09 日漫
php中使用cookie来保存用户登录信息的实现代码
2012/03/08 PHP
学习PHP Cookie处理函数
2016/08/09 PHP
PHP实现搜索时记住状态的方法示例
2018/05/11 PHP
php5.x禁用eval的操作方法
2018/10/19 PHP
PHP如何通过表单直接提交大文件详解
2019/01/08 PHP
PHP数组基本用法与知识点总结
2020/06/02 PHP
javascript之querySelector和querySelectorAll使用介绍
2011/12/20 Javascript
12种不宜使用的Javascript语法整理
2013/11/04 Javascript
JavaScript判断变量是否为undefined的两种写法区别
2013/12/04 Javascript
jquery实现人性化的有选择性禁用鼠标右键
2014/06/30 Javascript
AngularJS入门教程(二):AngularJS模板
2014/12/06 Javascript
jquery实现TAB选项卡鼠标经过带延迟效果的方法
2015/07/27 Javascript
解析JavaScript中的字符串类型与字符编码支持
2016/06/24 Javascript
Javascript计算二维数组重复值示例代码
2016/12/18 Javascript
前端自动化开发之Node.js的环境搭建教程
2017/04/01 Javascript
vue-cli3.0+element-ui上传组件el-upload的使用
2018/12/03 Javascript
vue中利用Promise封装jsonp并调取数据
2019/06/18 Javascript
vue中npm包全局安装和局部安装过程
2019/09/03 Javascript
[04:30]显微镜下的DOTA2第五期——拉比克
2013/09/26 DOTA
python遍历类中所有成员的方法
2015/03/18 Python
Python使用PyCrypto实现AES加密功能示例
2017/05/22 Python
python批量实现Word文件转换为PDF文件
2018/03/15 Python
python tkinter库实现气泡屏保和锁屏
2019/07/29 Python
Python selenium页面加载慢超时的解决方案
2020/03/18 Python
详解python datetime模块
2020/08/17 Python
matplotlib之pyplot模块之标题(title()和suptitle())
2021/02/22 Python
小蚁科技官方商店:YI Technology
2019/08/23 全球购物
大专自我鉴定范文
2013/10/01 职场文书
质检员岗位职责
2013/12/17 职场文书
音乐教育感言
2014/03/05 职场文书
设计专业自荐信
2014/06/19 职场文书
党的群众路线教育实践活动专题组织生活会发言材料
2014/10/17 职场文书
2015年母亲节活动总结
2015/02/10 职场文书
原生CSS实现文字无限轮播的通用方法
2021/03/30 HTML / CSS
Python装饰器的练习题
2021/11/23 Python