如何將html元素左移使用jquery和javascript

我在我的html中有一個按鈕。點擊它，我想在按鈕前面插入一個綠色框（「div」）。有沒有在jQuery的方式來做到這一點？我寫了下面的代碼，但它不起作用。新元素出現在我的按鈕上。如何將html元素左移使用jquery和javascript

click: function() { 
    var oldLeft = parseInt($('#addButton').css('left')); 
    var newFU = $('<div class="fu"></div>'); 
    newFU.insertBefore("#addButton"); 
    var newLeft= oldLeft + newFU.width(); 
    $("#addButton").css("left", newLeft); 
    $(this).dialog("close"); 
}

相關的CSS是這樣的：

：

div .fu { 
    width: 50px; 
    height: 50px; 
    background-color: #19833F; 
    position: absolute; 
    color: white; 
    text-align: center; 
    vertical-align: middle; 
} 
.addButton{ 
    font-weight: bolder; 
    background-color: white; 
    color: #20ff5c; 
    font-size: 18px; 
    left: 20px; 
}

來源

2014-10-07 Govan

小提琴請 – 2014-10-07 08:56:00

您是否考慮過在模型中構建所需的視圖，然後通過添加和刪除內容來創建您想要的視圖？通過閱讀你的風格，它表明你無論如何都無法接近理想的行爲。 – kidwon 2014-10-07 09:04:34

我通過定義與相對位置的按鈕解決了這個問題。

addButton{ 
    font-weight: bolder; 
    background-color: white; 
    color: #20ff5c; 
    font-size: 18px; 
    left: 10px; 
    position: relative; 
}

來源

2014-10-07 09:04:58 Govan

如何將html元素左移使用jquery和javascript

回答

相關問題