原创一个js对联广告类（兼容FireFox）
作者：biyuan 来源：biyuan的专栏 发布时间：2008-08-01 18:08:00
标签：对联,广告,firefox
兼容当前HTML/XHTML文档是否有DTD声明：
以下为程序代码：
var xtop = document.documentElement.scrollTop || document.body.scrollTop
从例子中我们可以得出一个层垂直居中于网页的CSS解决方案：
以下为程序代码：
.floatad {
height:400px;
top:50％;
margin-top:-200px;
}
/*关键技巧就在top和margin-top上*/
具体代码：
以下为程序代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="zh-CN">
<head profile="http://gmpg.org/xfn/11">
<title>对联广告</title>
<style type="text/css">
.floatad {
position:absolute;
width:100px;
height:400px;
top:50％;
margin-top:-200px;
background:red;
}
#float1 {
left:0px;
}
#float2 {
right:0px;
}
</style>
</head>
<body>
<div style="height:3000px"></div>
<div id="float1" class="floatad"><a href="javascript:FloatDiv.Close('float1');">×</a></div>
<div id="float2" class="floatad"><a href="javascript:FloatDiv.Close('float1','float2');">×</a></div>
<script>
var FloatDiv = {
Float : function (){
var xtop = document.documentElement.scrollTop || document.body.scrollTop;
for(var i = 0; i < arguments.length; i ++){
var _float = document.getElementById(arguments[i]);
_float.style.top = "50％";
_float.style.marginTop = parseFloat(xtop) - parseFloat(_float.clientHeight) / 2 + "px";
}
},
Close : function (){
for(var i = 0; i < arguments.length; i ++){
var _float = document.getElementById(arguments[i]);
_float.style.display = "none";
}
}
};
window.onscroll = function () {FloatDiv.Float("float1", "float2");}
</script>
</body>
</html>
演示：
Floatad-js.htm （1.36 KB）
0
投稿猜你喜欢
- 如今大部分网站仍然采用表格嵌套内容的方式来制作网站，虽然此方法对于我们来说比较熟悉、比较上手；但是，它却阻碍了一种更好的、更有亲和力的、更灵
- 我在一篇文章所说，首页的“站点名称”最好用h1标签来定义，但从美观考虑，要用logo图片来代替h1，这时需要隐藏h1内的这段文字，但又不能对
- 想要一个这玩意，可是找了网上许多着色器，要么是兼容性成问题，要么是匹配不精确，比如说：1、注释里包含字符串、关键词，类似于：/* xxxx&
- 批量修改： EXEC sp_MSforeachtable 'exec sp_changeob
- 按单字节计算字符串的长度，汉字算两个字节。<script type="text/JavaScript"
- python使用utf8编码，mysql也是utf8编码，是什么问题?后来查了一下，使用一个简单的办法即可：vsql = "ins
- InnoDB给MySQL提供了具有提交，回滚和崩溃恢复能力的事务安全(ACID兼容)存储引擎。InnoDB锁定在行级并且也在SELECT语句
- 1. 你必须有自己的服务器，可以在服务器上建立站点。2. 域名管理里 你的域名必须支持泛解析。（现在好像除了 双线双I
- 具体代码如下：Function ASTCreateFtpSite(IPAddress, RootDirectory,&n
- 最近对微格式进行了一些学习，在学习过程中收获不少。在此分享下，欢迎交流！微型格式的优点：1，语义化的HTML和CSS类名称来标记共同内容。2
- 樂思蜀将SEO工作中所需要的301转向代码进行了整理，收藏并分享，以备查阅。1、IIS下301设置 Internet信息服务管理器 ->
想必每个DBA都喜欢挑战数据导入时间，用时越短工作效率越高，也充分的能够证明自己的实力。实际工作中有时候需要把大量数据导入数据库，然后用于各- SQL Server数据库查询优化的常用方法总结:本文中，abigale代表查询字符串，ada代表数据表名，alice代表字段名。技巧一：问
- 选择最实用来谈一下首先，你要慎重选择你就业的城市。这点是目前多数人都忽略的重要因素。无论你的设计思路和发展方向都要依托你所在城市来作为载体。
- 组合集总计： group by with rollup/cube grouping sets 子查询按执行方式分：标准子查询、关联子查询 标
- 呵呵，我之前也写过一个类似的模板替换功能.>> 已实现：>、<、>=、<=、=、==等简单的运算>
- 1. Document.form.item 问题 现有问题：
- 1、为什么淘宝的手机频道页面，竟然会有笔记本、数码相机、随身听，甚至是游戏之类的栏目，而且还有一个“数码·生活”栏目是包括以上这些设备的综合
- 一个小代码 类似资源管理器效果 支持鼠标拖拽 没写些细节东西 JavaScript语言:
- CSS换肤技术一直是一个比较热门的话题，通过给HTML文档不同的CSS样式应用，实现完全不同或风格迥异的页面效果。这样的技术一直为大家所津津
