使用位置在圖像上添加文字

我想在圖像上動態添加文字。我試圖使用JavaScript/jQuery來做到這一點。下面是代碼：使用位置在圖像上添加文字

$(document).ready(function() 
{ 
    var img = $("img#back1"); 
    var leftpos = img.position().left; 
    var toppos = img.position().top; 
    var div = document.createElement('div'); 
    div.style.position = 'absolute'; 
    div.style.top = toppos+"px"; 
    div.style.left = leftpos+"px"; 
    div.innerHTML = '<font> back </font>'; 
    div.style.background = '#CC0000'; 
    document.body.appendChild(div); 
});

這樣做了以後，我沒有得到文本「返回」在圖像上。這裏，正確的位置不能被檢索傳遞給012標籤的頂部和左指定文本。如果我在某個地方出了問題，請建議/糾正我。

感謝

來源

2012-02-14 HarsH1610

您可以在這裏用CSS發佈您的HTML代碼，如果您可以提供JSFiddle鏈接，那麼可以更好。可能是因爲你不知道你的div缺少Z-index。 – Gurvinder 2012-02-14 11:34:25