Question

<script>
$(document).ready(function(){
$(".text-button-degree").click(function(){
var ul = $(this).next("ul");
if (ul.is(":hidden")) {
    ul.show(300);
} else {
    ul.hide(300);
}
  });
});
</script>

#engineering_small  { 
background-image:url(img/faculty_icons/engineering_small.png);  
width:25px;  
height:25px;
}

.degree-list-group  {
display:none;
}

.degree-list-group li   {
margin-left:35px;
margin-top:15px;
font-size:12px; 
}

.text-button-degree {
background:none !important;
border:none !important;
margin-left:10px;
padding-left:0px;
margin-top:-1px;
color:#ff6445 !important;
font-size:18px !important;
}

<div>
<div id="engineering_small" style="float:left;"></div>
<input type="button" name="sort-div" value="Architecture" class="text-button-degree"/>                          
<ul class="degree-list-group">
    <li><a href="#">Architecture</a></li>
    <li><a href="#">Civil engineering</a></li>
</ul>
</div>

一切正常;但是，根据需要展开ul，我需要更改按钮的字体大小。当我这样做时，代码仍然有效，但滚动是有点奇怪。在动画开始时，ul会向右移动一点，当动画结束时，它会跳转到应该的位置。

我不知道是什么导致了这一点，但显然，按钮的字体大小似乎涉及到了。

Answer 1

没关系，发现边缘顶部：-1px;引起了这个问题。

jQuery显示/隐藏保证金问题

1 个答案: