RC wrote:
Please look at this page: http://www.norbertverboeket.com/test
When the user clicks on 'Click here', the function SwitchSheets should
switch the stylesheets:
document.all["ScreenStyle"].SetAttribute("HREF", "BigStyle.css",0);
The only thing I get is 'error on page'.
I have IE 6. What am I doing wrong here?
JavaScript/JScript is case-sensitive and the relevant method name is
called setAttribute (small "s"). Be very careful with MSDN samples for
JScript: they are plain of case typos as some sections seem to be made
by pure VB guys who missed to switch the mind on time. Some parts are
really funny in this matter, like say FileSystemObject specs: here
proper case/ case mishmash are going from method to method
alphabetically. Evidently it was made by two people with C++ practice
and VB practice respectively, so the correcteness depended on who came
back from the coffee break. :-)
Also document.all is IE-specific collection. The rest of the civilized
word :-) is using document.getElementById method.
Here is a working sample for both IE and Firefox (you need sheet1.css
and sheet2.css with different rules for P element to see the effect):
<html>
<head>
<title>CSS Switch</title>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
<link id="mySheet" rel="stylesheet" href="sheet1.css">
<script type="text/javascript">
function changeSheet() {
var mySheet = document.getElementById('mySheet');
if (('undefined' == typeof mySheet.main) || (mySheet.main)) {
mySheet.href = 'sheet2.css';
mySheet.main = false;
}
else {
mySheet.href = 'sheet1.css';
mySheet.main = true;
}
}
</script>
</head>
<body>
<p>Sample</p>
<button type="button" onClick="changeSheet()">Change
stylesheet</button>
</body>
</html>