避免对slideDown产生奇怪的影响

时间:2014-11-26 19:33:48

标签: javascript jquery css

在我的应用中,我使用slideDown()会产生非常难看的副作用。单击元素时,会将一段内容附加到祖先。副作用是点击的按钮跳到右边,左边的两个按钮移动了两点。我只想让按钮组保持不动。

就在这里,只需点击黄色刷新按钮:jsfiddle

$(document).on('click', '#counter-offer', function(e) {
    e.preventDefault();
    var thiz = $(this);
    var element = thiz.closest('#negotiation-buttons').find('div#counter-offer-form-container')
    $.get('/negotiation/counter_offer_form', $(this).find('form').serialize(), function(data) {
        if (element.length) {
            element.slideUp('200', function() {
                element.remove();
            });
        }  else {
            thiz.closest('#negotiation-buttons').append(data['form']).
            find('#counter-offer-form-container').hide().slideDown(400);
        }
    });
});

我不知道如何避免这种情况。有什么想法吗?

1 个答案:

答案 0 :(得分:0)

一种解决方案是设置固定大小的容器

#negotiation-buttons {
    width: 300px;
}

http://jsfiddle.net/0m4qq484/5/