W Google Chrome zmiany widać dopiero gdy przez podgląd źródła kliknę na obiekt którego zmiana dotyczyła a w FF w ogóle nie widać zmiany.
wejdź operą lub mozillą z firebugiem (po to żeby przeedytować szybko źródło strony - gdyż nie będę tu emulował odpowiednich nagłówków ;p) na stronę:
, w operze kliknij źródło i podmienisz całe, w firebugu daj podgląd i podmień body - i źródło poniżej (najedź myszką na ten duuuży biały "trójkąt") - poszukaj u siebie błędów
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>XTech SVG Demo</title>
<style>
stop.begin { stop-color:yellow; }
stop.end { stop-color:green; }
body.invalid stop.end { stop-color:red; }
#err { display:none; }
#ff{fill:white;stroke:red;stroke-width:4;}
body.invalid #err { display:inline; }
</style>
<script>
function signalError() {
document.getElementById('body').
setAttribute("class", "invalid");
}
</script>
</head>
<body id="body"
style="position:absolute; z-index:0; border:1px solid black; left:5%; top:5%; width:90%; height:90%;">
<form>
<fieldset>
<legend>HTML Form</legend>
<p><label>Enter something:</label>
<input type="text"/>
<span id="err">Incorrect value!</span></p>
<p><button onclick="signalError();">Activate!</button></p>
</fieldset>
</form>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1"
viewBox="0 0 100 100"
preserveAspectRatio="xMidYMid slice"
style="width:100%; height:100%; position:absolute; top:0; left:0; z-index:-1;">
<linearGradient id="gradient">
<stop class="begin" offset="0%"/>
<stop class="end" offset="100%"/>
</linearGradient>
<rect x="0" y="0" width="100" height="100"
style="fill:url(#gradient)" />
<circle cx="50" cy="50" r="30"
style="fill:url(#gradient);" />
<path id="ff" d="M25,15L15,35 35,35 Z"/>
<path d="M50,80 L90,100 75,35 Z" style="fill: white;" onmouseover="this.setAttribute('style','fill: #FF0000;');"/>
</svg>
</body>
</html>
: