我是一个固定在页面底部中心的小div。现在我想要最初的div将不可见。当用户点击按钮时,div将从浏览器的下边缘向上滑动,当用户再次点击按钮时,div将向下滑动到底部。
这种方式我试过,但我的示例代码无法正常工作
#BusyBox
{
background: -moz-linear-gradient(center top , #F1F2F2 0%, #F1F2F2 100%) repeat scroll 0 0 transparent;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
bottom: 0;
font-size: 0.8em;
font-style: normal;
font-weight: normal;
left: 50%;
margin-left: -45px;
padding-top: 20px;
position: fixed;
text-align: center;
width: 90px;
height: 50px;
margin-top: -50px;
background-repeat:no-repeat;
background-position: center center;
}
<script type="text/javascript">
$(document).ready(function () {
var flag = 1;
$("#Process").click(function () {
if (flag == 1) {
$('#BusyBox').stop(true).animate({ 'marginTop': '50px', 'opacity': '0' }, { queue: false, duration: 300 });
flag = 0;
}
else {
$('#BusyBox').stop(true).animate({ 'marginTop': '-50px', 'opacity': '1' }, { queue: false, duration: 300 });
flag = 1;
}
return false;
});
});
</script>
<asp:Button ID="Process" runat="server" Text="Click" />
<div id="BusyBox" >
<img src="images/loader.gif" alt="Loading..."/>
<div>
<em>Loading Wait...</em>
</div>
</div>
请帮助我的代码错误在哪里。感谢