在滑动滚动条的情况下,div始终定位到当前窗口的中心!
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>div居中</title>
<style type="text/css">
body,html{height:100%;padding:0;margin:0;}
.divPanel{
border:1px solid red;
width:100px;
height:100px;
left:800px;
top:20px;
position:fixed;
_position:absolute;
_top:expression(eval( document.documentElement.clientHeight==0?(document.body.scrollTop):(document.documentElement.scrollTop))+20+"px");
}
#panel2{
border:1px solid #339966;
width:300px;
width:300px;
height:100px;
left:50%;
top:50%;
margin-left:-150px;
margin-top:-50px;
position:fixed;
_position:absolute;
_left:expression(eval(
document.documentElement.clientHeight==0
?document.body.offsetWidth
:document.documentElement.clientWidth
)/2+"px");
_top:expression(eval(document.documentElement.clientHeight==0?(document.body.scrollTop+document.body.clientHeight/2):(document.documentElement.scrollTop+document.documentElement.clientHeight/2))+"px");
}
</style>
</head>
<body>
<!--
<textarea id="txt1" rows="20" cols="60"></textarea>
<textarea id="txt2" rows="20" cols="60"></textarea>
<textarea id="txt3" rows="20" cols="60"></textarea>-->
<div id="panel" class="divPanel"></div>
<div id="panel2">dddd</div>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
</body>
</html>
分享到:
相关推荐
div滚动条 带滚动条的div div滚动条样式div滚动条 带滚动条的div div滚动条样式
div随滚动条上下滚动,div随滚动条上下滚动div随滚动条上下滚动div随滚动条上下滚动
拖动div 内部有滚动条
div固定在屏幕的一个位置,不随滚动条的拖动而改变位置
jQuery实现将div的滚动条滚动到指定位置 jQuery实现将div的滚动条滚动到指定位置
网页局部div随滚动条置顶滚动 效果很好,跟普通的滚动不太一样,没有延迟。
"让DIV固定在页面的某个位置而不随着滚动条随意滚动" 在前端开发中,我们常常需要让某个DIV元素固定在页面的某个位置,而不随着滚动条的滚动而移动。这可以通过使用CSS的position属性来实现,特别是使用fixed值。...
div滚动条样式一览-div+css设计网,div滚动条,多个div滚动条样式
DIV滚动悬浮层,页面滚动条滚动,悬浮层保持位置不变!
该html代码是实现DIV居中及DIV垂直居中的实例,包括: div居中, div内文本居中及垂直居中, div嵌套div并居中, div嵌套div并垂直居中.
div或其他html块内容跟随滚动条移动,滚动移动时,内容跟着移动,并保持最右边
优秀的的div滚动条优化代码 优化之后不在影响滚动功能的情况下使div的滚动条变为半透明的...
这款滚动条还不错,而且修改容易!即使对DIV+CSS初学者都能修改使用!
div 移动 网页 webapp 左右滑动 滑动 swipe
NULL 博文链接:https://javapub.iteye.com/blog/709361
可以自己定义滚动条,根据div内容自己调节产生横向和竖向滚动条。滚动条所有元素都可以自己定义样式,包括颜色或者图片。
项目需求是这样的:在一个页面放2个悬浮框,悬浮框随页面的上下滚动有上下波动的效果,最终固定在同一位置,下面通过本文给大家分享基于JavaScript实现div层跟随滚动条滑动的相关资料,对js div跟随滚动条滑动相关...
纯css实现table滚动条(纯css实现div滚动条),主要是通过设定高度/宽度及overflow:auto;实现.
jquery滚动条jquery滚动条jquery滚动条jquery滚动条jquery滚动条jquery滚动条jquery滚动条jquery滚动条jquery滚动条jquery滚动条jquery滚动条jquery滚动条jsDIV滚动条jsDIV滚动条jsDIV滚动条
jquery hover事件鼠标悬停导航条浮动div层滑动高亮显示 jquery hover事件鼠标悬停导航条浮动div层滑动高亮显示 jquery hover事件鼠标悬停导航条浮动div层滑动高亮显示