js兼容多个浏览器右下角漂浮广告 -- [页面特效]─ 深山工作室提供网络投票系统|微信公众号投票|微信公众号小程序|抖音小程序|百度小程序|微信公众号开发|企业网站建设

js兼容多个浏览器右下角漂浮广告

深山工作室 2013/12/31 19:47:11 深山行者字体:大中小浏览 7602

js兼容多个浏览器右下角漂浮广告

兼容ie6 7 8 ,ff3.5 3.6,chrome 4.1.2,safari

xhtml1.0解析

以下为详细代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://<a name="qihoosnap0"></a>www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<title>Untitled Document</title>
<style>
html,body{
padding:0;
margin:0;
}
</style>
</head>
<body>
<div <a name="qihoosnap5"></a>id="aa" style="width:100px;height:100px;background:#c0c0c0;" >我在随平滚</div>
<div id="bb" style="width:100px;height:100px;background:#c0c0c0;" >我静止不动</div>
<div style="width:100%;height:1500px;background:#000"></div>
<div style="width:100%;height:1500px;background:green"></div>
<div style="width:100%;height:1500px;background:red"></div>
</body>
</html>
<script>
function scrollx(p){
var d = document,dd = d.documentElement,db = d.body,w = window,o = d.getElementById(p.id),ie6 = /msie 6/i.test(navigator.userAgent),style,timer;
if(o){
o.style.cssText +=";position:"+(p.f&&!ie6?'fixed':'absolute')+";"+(p.l==undefi<a name="qihoosnap3"></a>ned?'right:0;':'left:'+p.l+'px;')+(p.t!=undefined?'top:'+p.t+'px':'bottom:0');
if(p.f&&ie6){
o.style.cssText +=';left:expression(documentElement.scrollLeft + '+(p.l==undefined?dd.clientWidth-o.offsetWidth:p.l)+' + "px");top:expression(documentElement.scrollTop +'+(p.t==undefined?dd.clientHeight-o.offsetHeight:p.t)+'+ "px" );';
dd.style.cssText +=';background-image: url(about:blank);background-attachment:fixed;';
}else{
if(!p.f){
w.onresize = w.onscroll = function(){
clearInterval(timer);
timer = setInterval(function(){
//双选择为了修复chrome 下xhtml解析时dd.scrollTop为 0
var st = (dd.scrollTop||db.scrollTop),c;
c = st - o.offsetTop + (p.t!=undefined?p.t:(w.innerHeight||dd.clientHeight)-o.offsetHeight);
if(c!=0){
o.style.top = o.offsetTop + Math.ceil(Math.abs(c)/10)*(c<0?-1:1) + 'px';
}else{
clearInterval(timer);
}
},10)
}
}
}
}
}
scrollx({
id:'aa'
})
scrollx({
id:'bb',
l:0,
t:200,
f:1
})
/*
id 你要滚动的内容的id
l 横坐标的位置 不写为紧贴右边
t 你要放在页面的那个位置默认是贴着底边 0是贴着顶边
f 1表示固定 不写或者0表示滚动
*/
</script>

html4.01解析

以下为详细代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<title>Untitled Document</title>
<style>
html,body{
padding:0;
margin:0;
}
</style>
</head>
<body>
<div id="aa" style="width:100px;height:100px;background:#c0c0c0;" >我在随平滚</div>
<div id="bb" style="width:100px;height:100px;background:#c0c0c0;" >我静止不动</div>
<div style="width:100%;height:1500px;background:#000"></div>
<div style="width:100%;height:1500px;background:green"></div>
<div style="width:100%;height:1500px;background:red"></div>
</body>
</html>
<script>
function scroll(p){
var d = document,dd = d.documentElement,db = d.body,w = window,o = d.getElementById(p.id),ie = /msie/i.test(navigator.userAgent),style,timer;
if(o){
//ie8下position:fixed下top left失效
o.style.cssText +=";position:"+(p.f&&!ie?'fixed':'absolute')+";"+(p.l==undefined?'right:0;':'left:'+p.l+'px;')+(p.t!=undefined?'top:'+p.t+'px':'bottom:0');
if(p.f&&ie){
o.style.cssText +=';left:expression(body.scrollLeft + '+(p.l==undefined?db.clientWidth-o.offsetWidth:p.l)+' + "px");top:expression(body.scrollTop +'+(p.t==undefined?db.clientHeight-o.offsetHeight:p.t)+'+ "px" );'
db.style.cssText +=";background-image:url(about:blank);background-attachment:fixed;"
}else{
if(!p.f){
w.onresize = w.onscroll = function(){
clearInterval(timer);
timer = setInterval(function(){
var st = db.scrollTop,c;
c = st - o.offsetTop + (p.t!=undefined?p.t:(w.innerHeight||db.clientHeight)-o.offsetHeight);
if(c!=0){
o.style.top = o.offsetTop + Math.ceil(Math.abs(c)/10)*(c<0?-1:1) + 'px';
}else{
clearInterval(timer);
}
},10)
}
}
}
}
}
scroll({
id:'aa'
})
scroll({
id:'bb',
l:0,
t:200,
f:1
})
/*
id 你要滚动的内容的id
l 横坐标的位置 不写为紧贴右边
t 你要放在页面的那个位置默认是贴着底边 0是贴着顶边
f 1表示固定 不写或者0表示滚动
*/
</script>

前一页:兼容pc、移动端用js实现复制内容到剪切板（支持苹果safari浏览器）

后一页:兼容ie6+和火狐的禁止右键

相关阅读: 键盘上shift键的奇妙用途; 浅谈 Vista系统设置IIS7攻略; 设置两个未知高度的DIV保持等高; 平遥旅游360网; 让DIV固定在浏览器窗口的底部（兼容IE6）; 利用javascript简短功能就可以检查form表单中的元素是否已经填写; java探测页面是否全屏，如果不是全屏则自动全屏; Dreamweaver在onLoad运行_onOpen.htm时,发生了以下javascript错误

共有0条关于《js兼容多个浏览器右下角漂浮广告》的评论: 发表评论

正在加载评论......

返回顶部发表评论

呢称:
表情:
内容:	评论内容:不能超过 1000 字,需审核,请自觉遵守互联网相关政策法规。
验证码:

网友评论声明,请自觉遵守互联网相关政策法规。

您发布的评论即表示同意遵守以下条款:
一、不得利用本站危害国家安全、泄露国家秘密,不得侵犯国家、社会、集体和公民的合法权益;
二、不得发布国家法律、法规明令禁止的内容;互相尊重,对自己在本站的言论和行为负责;
三、本站对您所发布内容拥有处置权。

更多信息>>栏目类别选择: 百度小程序开发; 微信小程序开发; 微信公众号开发; uni-app; asp函数库; ASP; DIV+CSS; HTML; python

更多>>同类信息: jquery下拉到某个固定位置然后某些元素发生改变样式状态; canvas绘制的文字如何换行; 兼容pc、移动端用js实现复制内容到剪切板（支持苹果safari浏览器）; js兼容多个浏览器右下角漂浮广告; 兼容ie6+和火狐的禁止右键; 做在线客服时，聊天窗口的div滚动条始终在底部

更多>>最新添加文章: dw里面查找替换使用正则删除sqlserver里面的CONSTRAINT; Android移动端自动化测试：使用UIAutomatorViewer与Selenium定位元素; 抖音直播音挂载小雪花懂车帝小程序; javascript获取浏览器指纹可以用来做投票; 火狐Mozilla Firefox出现：无法载入您的Firefox配置文件它可能已经丢失或是无法访问问题解决集合处理办法; 在Android、iOS、Windows、MacOS中微信小程序的文件存放路径; python通过代码修改pip下载源让下载库飞起; python里面requests.post返回的res.text还有其它的吗

更多>>随机抽取信息: 山西省青年旅行社; 放大的分页代码; 设置自己个性的网页滚动条附详细介绍; 静态页面在文本框中输入数字，表格直接算出相应的结果; 各个苹果手表型号版本对比以及查看苹果手机Apple Watch型号; 深山行者留言系统V2.2 .1 更新下载

更多标签热门标签

旅游 CSS滤镜 radio visite 容器建立日期在线参数结果日历故事网站地图 div的高度宽表达高度个性分辨率代码 css 版权设为首页强聊过期失效上下左右 float 模板 pt ajax web 2.0 评论原则个人安装包清除生成器 body ie5.5 option 分页表达式千位左右生成数据货币简易十字 Response 利用position把div放在flash上