我想在按钮下方找到一个div,在用户点击它之后会改变他的位置。
我为按钮实现了一个动画,当它完成时,会有一个回调函数“追加”新的div。新的div忽略了按钮的新位置,并且位于容器的顶部。
HTML:
<body>
<div id="inner_body" style="position:relative;margin: auto;text-align: center;width:50%;margin-top: 200px">
<button class="bc" id="0" style="margin-top: 400px;margin-left:20px;margin-right:20px;padding: 20px;background-color: #718bf3">Botton A</button>
</div>
</body>
JQuery的:
$(document).ready(function () {
$(document).on('click', '.bc', function () {
var x = $('#0').position().left;
var y = $('#0').position().top;
$('#0').css({ 'position': 'absolute', 'top': y + 'px', 'left': x + 'px' })
$('#' + this.id + '').animate({ left: 0, marginTop: 0 }, "slow", function () {
appendnow();
});
});
function appendnow() {
$('#inner_body').append('<div >Should be below button</div>');
}
});