Hello everyone!
I'm new to SVG and web design in general and I am testing out SVG in HTML5. I
came up with a tutorial that I can't seem to get working, I was wondering if
someone here could help me troubleshoot it. The script is supposed to draw out
a rectangle based on two user inputs (width, height) from an HTML form. It
seems to be working in Chrome, it will draw the rectangle, but then disappears
a second after the submit button is pressed. Would anyone recommend a different
approach to the problem?
Thanks in advance!
Aron
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<form>
Input Rectangle Width Here:<input type="text" name="width" id="w"/><br
/>
Input Rectangle Height Here:<input type="text" name="height"
id="h"/><br />
<input type="submit" value="Draw Rectangle" onClick="createRect()"/>
</form>
<svg>
<script>
<![CDATA[
var svgNS = "http://www.w3.org/2000/svg";;
var xlinkNS = "http://www.w3.org/1999/xlink";;
function createRect(){
var newRect = document.createElementNS(svgNS,"rect");
var xx = document.getElementById("w").value;
var yy = document.getElementById("h").value;
newRect.setAttributeNS(null,"width",xx);
newRect.setAttributeNS(null,"height",yy);
newRect.setAttributeNS(null,"fill-opacity",1);
newRect.setAttributeNS(null,"stroke-width",1);
newRect.setAttributeNS(null,"astroke-opacity",1);
newRect.setAttributeNS(null,"fill","white");
newRect.setAttributeNS(null,"stroke","black");
document.getElementById("firstGroup").appendChild(newRect);
};
]]>
</script>
<g id="firstGroup">
<rect x="100" y="100" />
</g>
</svg>
</body>
</html>
------------------------------------
-----
To unsubscribe send a message to: [email protected]
-or-
visit http://groups.yahoo.com/group/svg-developers and click "edit my
membership"
----Yahoo! Groups Links
<*> To visit your group on the web, go to:
http://groups.yahoo.com/group/svg-developers/
<*> Your email settings:
Individual Email | Traditional
<*> To change settings online go to:
http://groups.yahoo.com/group/svg-developers/join
(Yahoo! ID required)
<*> To change settings via email:
[email protected]
[email protected]
<*> To unsubscribe from this group, send an email to:
[email protected]
<*> Your use of Yahoo! Groups is subject to:
http://docs.yahoo.com/info/terms/
