How to set div tag height and width using javascript?
Question
How can I set the width and height of a div using JavaScript?
Here is my code
<%@page import="org.json.JSONObject"%>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>View JSON</title>
<script type="text/javascript">
var rect1='{"minX": 0.0,"minY": 0.0,"maxX": 2460.0,"maxY": 3008.0}';
var rectangle = JSON.parse(rect1);
var maxx=rectangle.maxX;
var maxy=rectangle.maxY;
***What should i do here?***
</script>
</head>
<body>
<h5>JSON View</h5>
<div id="set">
</div>
</body>
</html>
I want to set the div width to maxx and height to maxy values. I also want to set its border to 1px so that I can see whether it's working or not.
Thanks
2 answers
solution1
6 ACCPTED 2013-03-19 10:09:57
You need to use
document.getElementById('set').style.width = maxX + "px";
and
document.getElementById('set').style.height = maxY + "px";
Also, you may need to make sure the document is loaded before the script runs, or else the set div may not have been created. You do this in window.onload as foillows:
window.onload = function ()
{
Javascript code goes here
}
solution2
3 2013-03-19 10:03:25
You'd make use of the element's style :
document.getElementById('set').style.width = maxx + "px";
document.getElementById('set').style.height = maxy + "px";
document.getElementById('set').style.border = "1px solid #000";
Being a fixed value, border in this case would probably be better controlled with just CSS.
div#set {
border:1px solid #000;
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.