Posts Tagged ‘固定层’

支持各种浏览器的浮动固定层

March 2nd, 2010

直接上货

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<title>中国站长天空-网页特效-窗口特效-支持各种浏览器的固定悬浮层</title>
<meta http-equiv=”content-type” content=”text/html;charset=gb2312″>
<!–把下面代码加到<head>与</head>之间–>
<style type=”text/css”>
* {padding:0; margin:0;}
body {height:100%; overflow:hidden; font-size:14px; line-height:2; position:relative;}
html {height:100%; overflow:hidden;}
.fixed {position:absolute; top:10px; left:50%; width:100px; margin-left:-490px; height:350px; background:#fc0; border:1px solid #f60; text-align:center;}
.fixed2 {position:absolute; top:10px; left:50%; width:100px; margin-left:370px; height:350px; background:#fc0; border:1px solid #f60; text-align:center;}
.wrapper {height:100%; overflow:auto; overflow-y:scroll;}
.body {width:700px; margin:0 auto; background:#f2f2f2; padding:20px;}
</style> » Read more: 支持各种浏览器的浮动固定层

No comments »

Posted in Div+CSS

Tags:

跨浏览器的层固定定位

March 2nd, 2010

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd“>
<html xmlns=”http://www.w3.org/1999/xhtml“>
<head>
<style>
*{margin:0}
body{
height:1000px;
width:1000px;
}
#a{
width:300px;
height:100px;
background:red;
}
</style>
<script>
var isie6 = window.XMLHttpRequest?false:true;
window.onload = function(){
var a = document.getElementById(‘a’);
var d = document.getElementById(‘d’);
if(isie6){
a.style.position = ‘absolute’;

window.onscroll = function(){
d.innerHTML = ”;
}
}else{
a.style.position = ‘fixed’;
}
a.style.right = ’0′;
a.style.bottom = ’0′;
}
</script>
</head>
<body>
<div id =”d” style=”display:none;”></div>
<div id=’a'>test</div>
</body>
</html>

No comments »

Posted in Div+CSS

Tags:

固定层在页面的顶部,底部DIV

March 2nd, 2010
<html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″ />
<title>无标题文档</title>
<style type=”text/css”>
<!–
*{margin:0px;padding:0px;}
html,body{height:100%;width:100%;overflow:hidden;}
.xx {position:absolute;left:0px;top:0px;z-index:1;width:100%;background-color:#F3F6FB;border-bottom:1px solid #d0dbe7; margin-left:-18px; height:50px;}
.yy{ position:relative;width:100%;height:100%;overflow-x:auto;overflow-y:scroll; text-align:center}
–>
</style> » Read more: 固定层在页面的顶部,底部DIV

No comments »

Posted in Div+CSS

Tags: