0 
<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 在动画开始时向右移动了一点，当动画结束时，它会跳转到它应该在的位置。

我不知道是什么原因造成的，但显然，似乎涉及到按钮的字体大小。

4

1 回答 1

0

没关系，发现 margin-top:-1px; 导致了这个问题。

于 2013-08-12T01:59:20.693 回答