|
Posted by Gιrard Talbot on 12/23/78 11:28
Stuart a Γ©crit :
> typingcat@gmail.com wrote:
>
>> Hello.
>> I know it is possible to change separate elements' style by changing
>>
>> [element].style=[another style];
>>
>> But is it possible to set the entire page's stylesheet?
>> For example,
>> <head>
>> <link rel="stylesheet" type="text/css" href="style1.css" />
>> </head>
>>
>> Can I change "style1.css" to "style2.css" using Javascript and make the
>> page be changed dynamically?
>>
>
> It is possible - something like the following works :
>
> ....
>
> <link rel="stylesheet" href="style1.css" id="stylesheet">
link does not take an id attribute value.
>
> <script type="text/javascript">
>
> function changeStyle() {
> document.getElementById('stylesheet').href = 'style2.css';
> }
>
<link rel="stylesheet" type="text/css" href="default.css" title="Default">
<link rel="alternate stylesheet" type="text/css" href="Foo.css"
title="Foo">
(...)
function changeActiveStyleSheet(previous, new)
{
if(document.styleSheets)
{
for (var StyleSheetIterator = 0; StyleSheetIterator <
document.styleSheets.length; StyleSheetIterator++)
{
if(document.styleSheets[StyleSheetIterator].title == previous)
{
document.styleSheets[StyleSheetIterator].disabled = true;
};
if(document.styleSheets[StyleSheetIterator].title == new)
{
document.styleSheets[StyleSheetIterator].disabled = false;
};
};
};
}
/*
http://www.w3.org/TR/2000/REC-DOM-Level-2-Style-20001113/stylesheets.html#StyleSheets-StyleSheet
*/
(...)
Default stylesheet: <input type="radio" ...
onclick="changeActiveStyleSheet('Foo', 'Default');">
Foo stylesheet: <input type="radio" ...
onclick="changeActiveStyleSheet('Default', 'Foo');">
Not tested. I'm sure the code could be improved but the general design
is correct. Opera 7+ will not support document.styleSheets collection
but there is an UI for choosing stylesheets.
GΓ©rard
--
remove blah to email me
[Back to original message]
|