Div点击它时没有正确滑动

Question

我有一个div在点击按钮/链接后向上滑动，但它似乎先稍微向下移动然后备份，这使它看起来有点奇怪。单击按钮/链接时，它应该向上滑动而不先向下移动。

这是我正在使用的jquery代码：

 $(document).ready(function($){
    $('#hide_cookie').click(function() {
      $('.cookie').slideUp('slow', function() {
        // Animation complete.
      });
    });
});

这是html代码：

<div class="cookie">
    <div class="container_12">
        <span>header here</span>
        <p>tex there</p>
    </div>
    <div class="button">
       <a href="#" id="hide_cookie" class="read-more">Continue</a>
    </div>
</div>

有什么建议吗？

Answer 1

元素需要具有height属性。否则jQuery不会做一个平滑的动画。

了解更多

  

Basic jQuery slideUp and slideDown driving me mad!

Answer 2

尝试event.preventDefault()

这里

 $('#hide_cookie').click(function(e) {
  e.preventDefault();
  $('.cookie').slideUp('slow', function() {
    // Animation complete.
  });
});