無法爲我的div使用jQuery設置絕對位置

嗨，請考慮以下html5文件。 div的位置仍然是0,0，邊界也沒有出現。我已經嘗試過對附件進行各種修改，但似乎並不奏效。

真的會感謝你的幫助Purmou和所有其他閱讀本說明。問候，sbguy

<!DOCTYPE html> 
<html lang="en-US"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Absolute Positioning Test</title> 
<style type="text/css"> 
html, body { 
    position:absolute; 
    top:0; 
    left:0; 
    margin:0px; 
    padding:0px 0px 0px 0px; 
    height:100%; 
    width:100%; 
} 
div { 
    margin:0px; 
    padding:0px 0px 0px 0px; 
} 
</style> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> 
<script type="text/JavaScript"> 
var A_height = 100; 
var A_width = 100; 
var A_top = 20; 
var A_left = 20; 
var B_height = 100; 
var B_width = 100; 
var B_top = 200; 
var B_left = 200; 
jQuery("#A").css({ 
    "position": "absolute", 
    "width": A_width + "px", 
    "height": A_height + "px", 
    "top": A_top + "px", 
    "left": A_left + "px", 
    "border": "1px solid black", 
    }); 
jQuery("#B").css({ 
    "position": "absolute", 
    "width": B_width + "px", 
    "height": B_height + "px", 
    "top": B_top + "px", 
    "left": B_left + "px", 
    "border": "1px solid black", 
    }); 
</script> 
</head> 
<body> 
<div id="A"> 
<p>HELLO A</p> 
</div> 
<div id="B"> 
<p>HELLO B</p> 
</div> 
</body> 
</html>

來源

2011-12-18 user1104170

我認爲你的變量有問題，你可以用div1A_topm b6x14height發佈完整的代碼。我測試了它的工作。當爲聲明變量設置手動值時。 – 2011-12-18 05:07:02

嘗試使用這樣的：

jQuery("#div1A").css({ 
    "position":"absolute", 
    "top": $("#div1A").offset().top + "px", 
    "left": $("#div1A").offset().left + "px", 
});

編輯：你顯然想設置變量div1A_top和div1A_left爲top和left CSS值：

jQuery("#div1A").css({ 
    "position":"absolute", 
    "top": div1A_top + "px", 
    "left": div1A_left + "px", 
});

來源

2011-12-18 04:53:39 Purag

謝謝Purmou。但是，這將取決於元素的當前位置並使其成爲絕對的。我需要使用javascript變量來明確定義頂部和左側位置。你可以請建議一個解決方案。謝謝，最好的問候，sbguy – user1104170 2011-12-19 04:38:34

@ user1104170：看我的編輯。我不明白你爲什麼在那裏有'$（窗口）'。 – Purag 2011-12-19 09:41:26

無法爲我的div使用jQuery設置絕對位置

回答

相關問題