SVG doesn't raise events when embedded in HTML

[Pretty woman]

Hi,

I am new to web technologies, including HTML, SVG and javascript. I followed the courses for these languages on www.w3schools.com. I have a question about events raised by a SVG document. The SVG is embedded in an HTML source.

I made a simple SVG file that contains a red circle with a black outline. I also wrote a javascript that turns the outline color red. The function is called by the onmouseover event from the circle. It all works properly when I open the SVG seperately in IE5. However, when I embed the SVG file in an HTML file it doesn't work properly anymore. I open the HTML in IE5, the SVG is showed, but it doesn't respond to events.

These are the sources I wrote:
HTML (main.html):
<HTML>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<BODY>
<object data="Circle1.svg" width="300" height="300"
type="image/svg+xml">
<embed src="Circle1.svg" width="300" height="300"
type="image/svg+xml" />

</object>
</BODY>

</HTML>

SVG (Circle1.svg):
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20000303 Stylable//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">

<svg width="300" height="300">
<script xlink:href="Circle1Script.js" type="text/javascript" />

<circle id="circle" cx="100" cy="50" r="40" stroke="black" stroke-width="8" fill="red" onmouseover="ChangeColor(evt)"/> </svg>

JavaScript (Circle1Script.js):
var svgDoc;
var svgObjCircle;

function initsvg(evt){

var directTarget = evt.getTarget;
if( directTarget.getNodeType != 9 ) // if not DOCUMENT_NODE { svgDoc = directTarget.getOwnerDocument; } else { svgDoc = directTarget; } svgObjCircle = svgDoc.getElementById("circle"); }

function ChangeColor(evt) {
var SVGDoc=evt.getTarget.getOwnerDocument;
svgObjCircle=SVGDoc.getElementById("circle");

svgObjCircle.setAttributeNS(null, "stroke", "red");
}