Question

我正在尝试用jquery动作制作替换动画，特别是要用

替换div的项目。

jQuery('#banner-sign-up-container').replaceWith('<div id="credit-limit-receipt" class="receipt"></div>').animate({'margin-top': '50px'}, 4000);

我希望＃credit-limit-receipt向上滑动，如该小提琴所示，但我的代码无法正常工作。我该怎么做？

我只希望我的文本像这张jsfiddle https://jsfiddle.net/MvQsT/1/

中的收据一样从底部向上滚动

Answer 1

您正在使用replaceWith()它将banner-sign-up-container替换为credit-limit-receipt，因此DOM值已更改，但是jquery链仍在尝试查找#banner-sign-up-container，但这不是可用，因此动画无法使用。

您需要将此代码分成两行。

检查以下示例：

$(function(){
    $('#banner-sign-up-container').replaceWith('<div id="credit-limit-receipt" class="receipt">Hi there!</div>');
    $('#credit-limit-receipt').animate({'margin-top': '50px'}, 1000);
});

div {
    background-color:#2795ee;
    width: 640px;
    margin:auto;
    margin-top: 300px;
    font-size:16px;
    text-align:center;
    padding:10px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="banner-sign-up-container">Something</div>

将动画添加到replaceWith（）jQuery

1 个答案: