2012-02-21 94 views
1

如何創建一個將使用類WSEDIT疊加每個html元素的按鈕。
如何在不同的包含div上創建疊加按鈕

首先我知道我需要一個javascript循環來查找每個元素用css類WSEDIT,並且動態創建一個按鈕,並在每個元素的前面加上一個WSEDIT類的按鈕。

的javascript循環的實例和按鈕創建

$(function() 
    $(".WSEDIT").each(function(){ 
     var btnConfigure = $("<div class='BBtnConfigure'>"); 
     $(this).prepend(btnConfigure); 
    }); 
); 


<div class="WSEDIT" style="width:200px;height:400px;border:1px solid #000000"> 
    <p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore 
    </p> 
<div> 

<div class="WSEDIT" style="width:200px;height:400px;border:1px solid #000000"> 
    <h2>Sale For First Trimestriel</h2> 
    <img src="/graph.png" /> 
<div> 


<div class="WSEDIT" style="width:200px;height:400px;border:1px solid #000000"> 
    <table> 
    <tr><td>Name</td><td>Sex</td></td>Age</td<td>Country</td></tr> 
    ... 
    </table> 

<div> 

這裏是我想在下面的圖片做。

enter image description here


的問題是,什麼應該是我的幹訓班按鈕BBtnConfigure
的CSS正如你可以在圖片中看到,BtnConfigure是重疊的每個部分。

回答

2
  1. 容器(WSEDIT)應該有position:relative,所以你可以絕對定位按鈕。
  2. 的按鈕應容器內
  3. 按鈕需要:position:absolute; top:-10px; right:-20px(約)
+0

Diodeus您好,這就是工作Perfecly。我覺得自己像個初學者。非常感謝。我會在5分鐘內標記爲答案。 – 2012-02-21 18:15:08

相關問題