为什么.append()会改变在jquery中克隆的元素的位置?

时间:2014-05-01 19:40:59

标签: javascript jquery position append

我正在尝试克隆一个元素并将其放置在原始元素的下方(或上方),只需添加样式“position:absolute”和“zIndex -1”,但它不起作用。 我试图检查追加前后的位置:它实际上是在没有任何解释的情况下改变的。我的意思是我希望这个位置与克隆对象保持一致。

那么为什么.append()会改变在jquery中克隆的元素的位置?

提前感谢您的帮助:)

<!DOCTYPE html>
<head>
<title>jQuery Test</title>
   <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
   <script type="text/javascript" language="javascript">
    function clicked() {
        var $pulsante_temp = $("#button1").clone();
        $("#div2").html("top: " + $pulsante_temp.position().top + " left: " + $pulsante_temp.position().left);
        $pulsante_temp.css({
            "position" : "absolute",
            "zIndex" : "-1"
        });
        $("#div1").append($pulsante_temp); 

        $("#div2").html($("#div2").html() + " After append: top: " + $pulsante_temp.position().top + " left: " + $pulsante_temp.position().left);

        $pulsante_temp.animate({
            top: "-=10px"
        }, 1000);
    }
   </script>
</head>
<body>
   <button id="button1" onclick="clicked()" style="z-index: 1;">TEST</button>
   <div id="div1" style="height: 30px;"></div>
   <div id="div2"></div>
</body>
</html>

0 个答案:

没有答案