对联代码分享

  • 9

以下是一个对联代码,如果大家喜欢,可以粘贴复制。

<!doctype html>
<html>
<head>
<meta charset=”utf-8″>
<title>对联js</title>
<style>
*{ margin:0; padding:0;}
#content{ width:960px; height:3000px; margin:0 auto; border:1px solid #CCC;}
#advLeft,#advRight{ position:fixed; top:100px; width:100px; height:400px; background:#CCC;}
#advLeft{ left:50%; margin-left:-591px;}
#advRight{ left:50%; margin-left:491px;}
</style>
</head>

<body>
<div id=”content”>
</div>
<a id=”advLeft” href=”javascript:;”>左</a>
<a id=”advRight” href=”javascript:;”>右</a>
<script>
window.onload = function()
{
ie6Fixed(‘advLeft’,’advRight’);
}

function ie6Fixed(oAdvLeft,oAdvRight)
{
if(window.navigator.userAgent.indexOf(‘MSIE 6′)==-1){return ”;}//如果浏览器非IE6则返回;
var oAdvL = document.getElementById(oAdvLeft);//获取左联
var oAdvR = document.getElementById(oAdvRight);//获取右联
var iAdvTop = parseInt(getStyle(oAdvL,’top’));//获取对联的初始顶部值
var iAdvHeight = parseInt(getStyle(oAdvL,’height’));//获取对联的初始高度值

oAdvL.style.overflow = oAdvR.style.overflow = ‘hidden’;
oAdvL.style.position = oAdvR.style.position = ‘absolute’;

window.onscroll = window.onresize = function()//当页面滚动或者页面缩放时
{
if(document.documentElement.clientHeight <= iAdvHeight + iAdvTop)//如果窗口高度小于等于对联的初始高度与初始顶部值之和
{
setScrollTop(getScrollTop());//设置scrollTop
oAdvL.style.height = oAdvR.style.height = Math.max(0,document.documentElement.clientHeight-iAdvTop) + ‘px’; //设置对联的高度,防止页面滚动到底部时继续向下滚动
}
else
{
oAdvL.style.height = oAdvR.style.height = iAdvHeight + ‘px’;//如果窗口高度大于对联的初始高度与初始顶部值之和还原对联初始值
}

oAdvL.style.top = oAdvR.style.top = getScrollTop()+iAdvTop+’px’;//设置对联的顶部值
}

//获得scrollTop
function getScrollTop()
{
return document.documentElement.scrollTop || document.body.scrollTop;
}
//设置scrollTop
function setScrollTop(iScrollTop)
{ www.xminseo.com
document.documentElement.scrollTop = document.body.scrollTop = iScrollTop;
}
//获得计算后的样式
function getStyle(obj,attr)
{
return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(obj,false)[attr];
}
}
</script>
</body>
</html>

继续阅读
  • 联系蓝色网络SEO
  • weinxin
  • 关注蓝色网络SEO
  • weinxin
蓝色网络
  • 本文由 发表于 2013年6月30日18:51:48
  • 转载请务必保留本文链接:http://alnss.cn/3930.html
匿名

发表评论

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: