标志赢得';t向下滑动(HTML、CSS、jQuery)
我使用jQuery在用户单击“登录”时向下滑动登录框。当它被点击时,我希望整个页面向下滑动,包括徽标。到目前为止,页面确实向下滑动,但徽标除外。您可以在此处查看该页面: 单击“登录”或“注册”时,页面主体向下滑动(将底部边距设置为500px以放大)。但是,正如您所看到的,徽标“mi.ni”并没有向下滑动标志赢得';t向下滑动(HTML、CSS、jQuery),jquery,html,css,Jquery,Html,Css,我使用jQuery在用户单击“登录”时向下滑动登录框。当它被点击时,我希望整个页面向下滑动,包括徽标。到目前为止,页面确实向下滑动,但徽标除外。您可以在此处查看该页面: 单击“登录”或“注册”时,页面主体向下滑动(将底部边距设置为500px以放大)。但是,正如您所看到的,徽标“mi.ni”并没有向下滑动 <div id = 'header'> <a href = '/' title = 'mi.ni' id = 'logo'>mi.ni</a> &l
<div id = 'header'>
<a href = '/' title = 'mi.ni' id = 'logo'>mi.ni</a>
</div>
标头被包装在包装器中。签到框从中滑下的条不在包装内
登录/注册框的CSS为:
#topBar #signIn, #signUp
{
width: 250px;
float: right;
color: #FFF;
margin-top: 5px;
font-weight: bold;
display: none;
margin-bottom: 500px;
}
在此问题上的任何帮助都将不胜感激
编辑:页面顶部横栏的HTML
<div id = 'topBarWrapper'>
<div id = 'topBar'>
<div id = 'mainTop'>
mi.ni is a URL shortening service. Learn more about mi.ni. I am trying my hardest to get the domain http://mi.ni.
</div>
<div id = 'rightTop'>
<span id = 'signInText'>Sign In</span>
|
<span id = 'signUpText'>Sign up</span>
</div>
<div id = 'signIn'>
<form action = '' method = 'POST'>
<table>
<tr>
<td>Username:</td>
<td><input type = 'text' name = 'username' id = 'usernameSignIn' class = 'input' /></td>
</tr>
<tr>
<td>Password:</td>
<td><input type = 'password' name = 'password' id = 'passwordSignIn' class = 'input' /></td>
</tr>
<tr>
<td></td>
<td><div class = 'signInSubmit'></div></td>
</tr>
</table>
</form>
</div>
<div id = 'signUp'>
<form action = '' method = 'POST'>
<table>
<tr>
<td>Username:</td>
<td><input type = 'text' name = 'username' id = 'usernameSignUp' class = 'input' /></td>
</tr>
<tr>
<td>Email:</td>
<td><input type = 'text' name = 'email' id = 'emailSignUp' class = 'input' /></td>
</tr>
<tr>
<td>Password:</td>
<td><input type = 'password' name = 'password' id = 'passwordSignUp' class = 'input' /></td>
</tr>
<tr>
<td></td>
<td><div class = 'signUpSubmit'></div></td>
</tr>
</table>
</form>
</div>
</div>
</div>
设置清楚:两个都在包装器分区上。那里有一些崩溃
#wrapper {
width: 1000px;
margin-left: auto;
margin-right: auto;
clear: both;
}
设置清楚:两个都在包装器分区上。那里有一些崩溃
#wrapper {
width: 1000px;
margin-left: auto;
margin-right: auto;
clear: both;
}
需要查看更多的HTML。我认为logo不是login元素的子元素(或类似的东西),但需要看到包含的HTML才能给你一个更好的答案。另外,我现在正在查看页面源代码。。。需要小心使用全局名称命名元素。。您有
id'header'
和id'body'
。这些可能会给以后添加HTML和CSS以跨越页面顶部的栏带来问题。我已经对获取.ni(尼加拉瓜)TLD做了广泛的研究,可能已经接近:)。此外,我没有看到“登录”元素的CSS。这是如何定位的?它是浮动的,相对的,绝对的,静态的。。。什么?在wrapper
上清除浮动需要查看更多HTML。我认为logo不是login元素的子元素(或类似的东西),但需要看到包含的HTML才能给你一个更好的答案。另外,我现在正在查看页面源代码。。。需要小心使用全局名称命名元素。。您有id'header'
和id'body'
。这些可能会给以后添加HTML和CSS以跨越页面顶部的栏带来问题。我已经对获取.ni(尼加拉瓜)TLD做了广泛的研究,可能已经接近:)。此外,我没有看到“登录”元素的CSS。这是如何定位的?它是浮动的,相对的,绝对的,静态的。。。什么?在wrapper
#wrapper {
width: 1000px;
margin-left: auto;
margin-right: auto;
clear: both;
}