-2

动画在这里工作，但我只想将 facebook 移动 10% 顶部并留下，但它消失了，我希望我在动画后留下来并慢慢登录表单淡入。

<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
</script>
<script> 
$(document).ready(function(){
$("div.login").hide();
$("p").slideUp(1000);
$("div.login").fadeIn(3000);
});
</script>

<style type="text/css">
*{margin:0; padding:0}
html, body {
color: #F00;
background-color: #333;
display: block;
height: 100%;
width: 100%;
}
.logo{width:100%; height:40%;}
p{font-size:200%; text-align:center; padding-top:20%}
.login{width:100%; height:60%; text-align:center;}
</style>
</head>
<body>

<div class="logo"><p>facebook</p></div>
 <div class="login">
    <ul>
        <li><label for="username">Username</label><input type="text"    placeholder="you@email.com" autofocus required /></li>
        <li><label for="Password">Password</label><input type="password" placeholder="you@email.com" autofocus required /></li>
        <li><button>Login</button></li>
    </ul>
</div>
</body>
</html>
4

1 回答 1

0 
 .slide up()

Description: Hide the matched elements with a sliding motion.

jQuery 文档

如果我正确理解您的问题，您实际上想要使用.animate() 

$('p').animate({'top':'-50px'}, 1000);

调整以适应元素的高度

于 2013-04-25T22:30:10.123 回答