开发者社区> 问答> 正文

jQuery控制div交换位置

div的id已知,想让两个div互换位置,并且具有动画效果,希望能给出解决方法,最好能有简易代码,多谢

展开
收起
小旋风柴进 2016-03-16 17:56:52 4922 0
1 条回答
写回答
取消 提交回答
  • <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.2.min.js"></script>
    <style>#div1,#div2{width:100px;height:100px;border:solid 1px #000;position:absolute;left:100px;top:100px;background:#eee;}#div2{top:300px;left:300px}</style>
    <input type="button" onclick="swap()" value="交换" />
    <script>
        function swap() {
            var div1 = $('#div1'), div2 = $('#div2');
            var p1 = div1.offset(), p2 = div2.offset();
            div1.animate(p2, 1000); div2.animate(p1, 1000);
        }
    </script>
    <div id="div1">div1</div><div id="div2">div2</div>
    2019-07-17 19:04:16
    赞同 展开评论 打赏
问答分类:
问答地址:
相关产品:
问答排行榜
最热
最新

相关课程

更多

相关电子书

更多
低代码开发师(初级)实战教程 立即下载
冬季实战营第三期:MySQL数据库进阶实战 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载