我使用Foundation框架创建我的网页,并使用Sticky Top-Bar导航作为简单选择表单的容器。虽然我确实让它起作用,当我向下滚动页面并且Sticky Top-Bar捕捉到窗口的顶部时,页面内容的其余部分会跳过'下降约60px左右。我现在已经搞乱了大约3个小时而没有运气。
我非常感谢任何见解或建议,尤其是那些熟悉基金会的人。
Here's the link to the page in question...
谢谢!
答案 0 :(得分:1)
基础粘性类的设计考虑了导航栏。导航栏的高度通常为45px,因此当它与粘性类绝对定位时,主体会获得具有相似高度的填充以补偿它。您可能想要摆弄.f-topbar-fixed
的顶部填充,以便它不会在滚动时跳转。
答案 1 :(得分:0)
可以选择删除滚动顶部
<html>
<title>dropdownlist</title>
<head>
<script language="Javascript" type="text/javascript" >
function choix(formulaire)
{
var j;
var i = form1.boite1.selectedIndex;
if (i == 0)
for(j = 1; j <3; j++)
form1.boite2.options[j].text="";
else{
switch (i){
case 1 : var text = new Array( "London","Manchester","Birmingham");
break;
case 2 : var text = new Array("Paris","Marseille","Lyon");
break;
case 3 : var text = new Array("Berlin","Munich","Francfort");
break;
}
for(j = 0; j<3; j++)
form1.boite2.options[j+1].text=text[j];
}
form1.boite2.selectedIndex=0;
}
</script>
</head>
<body>
<form name="form1">
<select name="boite1" onChange="choix(this.form)">
<option selected>country</option>
<option>England</option>
<option>France</option>
<option>Germany</option>
</select>
<select name="boite2">
<option selected>cities</option>
<option></option>
<option></option>
<option></option>
</form>
</select>
</body>
</html>
来自这篇文章http://foundation.zurb.com/forum/posts/881-page-jumps-to-top-on-top-bar-hamburger-icon-click