jQuery slideup влияет на верхнюю часть div

Question

Всякий раз, когда я пытаюсь сделать SlideUp() div моего, я замечаю, что он фактически не только скользит вверху снизу вверх, но также немного от верхнего слайда вниз к нижняя часть. Теперь, я не знаю, должно ли это быть таким, но это действительно беспокоит, и мне интересно, можно ли его удалить? Я только хочу, чтобы он скользил снизу вверх, оставляя верхнюю часть div неизменной.

Пустое пространство между темными и светлыми пурпурными областях это то, что делается в то время как он скользит вверх (это лучшее объяснение, которое я могу дать). Предполагается, что он должен скользить в сторону более темной пурпурной области, а не создавать там пустое пространство.

$(document).ready(function(){ 

    $(".toggleLatestUp").click(function() { 
     $(".QuickWrap").slideUp("slow"); 

    }); 

}); 

"легче фиолетовая область", которая должна скользить вверх, CSS (в случае необходимости):

.QuickWrap { 
     background: #F8E7FF; 
     float:left; 
     width: 100%; 
     margin:-18px 0 0 0; 
     margin-bottom:20px; 
     box-shadow: inset 0px 6px 5px #B9AEBD, inset 0px -6px 5px rgba(185, 174, 189, 0.41); 
     min-width: 1349px; 
    } 

Темнее фиолетовой область, CSS:

#HeadOverlay { 
    background: #9b59b6; 
    height: 250px; 
    width: 100%; 
    margin: 0; 
    bottom: 0; 
    background-repeat: repeat; 
    background-image: url("/templates/images/diagmonds.png"); 
    min-width: 1349px; 
    box-shadow: 0 0 6px #000; 
} 

HTML:

<div id="HeadOverlay"> 
    text 
</div> 
<br style="clear:both;"> 
<div class="QuickWrap"> 
    text 
</div> 

Примечание: не имеет значения, что имею внутри этих 2 блоков.

Answer 1

мне удалось решить. Это было настолько странно из-за отрицательной 18-й маржи .QuickWrap. Когда я переместил его на #HeadOverlay, он работает как шарм.

Answer 2

Это на самом деле работает:

http://codepen.io/anon/pen/JGvyqz

 if ($(".QuickWrap:first").is(":hidden")) { 
      $(".QuickWrap").show("slow"); 
     } else { 
      $(".QuickWrap").slideUp(); 
     } 

Ваша обертка часть предназначена для slideUp, показывая его, когда это не так.

И о вашем пробеле проблеме:

Replace вашего margin:0px 0 0 0; по margin: 0; в .QuickWrap