gpt4 book ai didi

javascript - 将 div 向下滑动到页面中间

转载 作者:太空宇宙 更新时间:2023-11-04 16:21:17 25 4
gpt4 key购买 nike

这是 jsFiddle: http://jsfiddle.net/arJEx/

这是我到目前为止得到的:

<!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" xml:lang="en" lang="en">

<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>Waiting</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js"></script>


<style>
* { margin:0;padding:0; }
#wait {

background:#ABC7D9;
border-top:4px solid #597F99;
border-bottom:4px solid #597F99;
padding:50px;
text-align:center;
font:23pt Georgia;
color:#1C5378;
display:none;
overflow: hidden;

}
</style>

<script type="text/javascript">
$(function() {

$(".act").live("click",function() {
$("#wait").slideDown("slow");
});
});
</script>

</head>

<body>

<button class="act">Activate effect</button>

<div id="wait">Please wait...</div>



</body>
</html>

我想要它,所以当我按下该按钮时,蓝色的 div 会向下滑动到页面的中间……但我似乎无法找到如何做到这一点。请帮忙?

编辑:好的,它不必位于屏幕中间但靠近部分顶部。就像..页面中间到顶部附近的任何地方。

最佳答案

您的 JS 一切都很好。您需要更改 CSS。首先div的容器必须填满所有窗口:

html, body { width: 100%; height: 100%; padding: 0; margin: 0; }

比更改 div 的 css。第一种方法(不确定 IE):

#wait {
/* remove padding and append those */
position: absolute;
top: 5%; /* change it */
bottom: 50%;
width: 100%
}

第二个:

#wait {
/* remove padding and append those */
height: 50%;
}

您需要解决一个问题。您需要在不使用填充的情况下垂直对齐您的文本,这是另一个问题(只需在 stackoverflow 或 goole 中搜索)。

关于javascript - 将 div 向下滑动到页面中间,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6526510/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com