jquery - 如何在滑动过程中保持 div 的边距？

Question

<button id="btnHome">HOME</button>
<div id="gall"></div>

CSS

#gall{
    margin-top:25px;
    height:70px;
    border:thin solid red;
}

JS

$("#btnHome").click(function() {
    $('#gall').slideToggle("slow");
});

在这个小提琴上，您可以看到#gallslidingDown 期间的上边距从0to开始25px，反之亦然。
我想#gall保持它的边距25px- 只是滑动保持这个边距值。

score 4 · Accepted Answer

首先，给!important你margin-top这样的：

#gall{
  margin-top:25px !important;
  height:70px;
  border:thin solid red;
}

其次，jQueryslideToggle()可以通过改变高度来隐藏和显示元素，谁知道jquery是否添加了其他css属性，解决方案是让你自己的动画像这样：

$("#btnHome").click(function() {
    $('#gall').animate({height:'toggle'},"slow");
});

祝你好运

score 3 · Accepted Answer

这是 slideToggle 功能的一部分，它为高度和边距设置动画。由于在 javascript 中删除了边距，我们可以使用 !important 覆盖它，所以试试

#gall{
    margin-top:25px !important;
    height:70px;
    border:thin solid red;
}

2 回答 2