ie gives a blank page with the below script, but fire fox works fine

[Revathi Balakrishnan]

Hi All
i am trying to change the font of my web page with user preference.i made use of cookie to get the user's preference, so that the font size selected will remain for the next session. i am changing the style sheet with the cookie set, The below shown is my code

function readCookie(name) {
        alert("i am Reading the cookies");
        var nameEQ = name + "=";
        var ca = document.cookie.split(';');
 
        for(var i=0;i < ca.length;i++) {
              var c = ca[i];
             while (c.charAt(0)==' ')
                {
                c = c.substring(1,c.length);
                if (c.indexOf(nameEQ) == 0)
                return c.substring(nameEQ.length,c.length);
               }
 
}
return null;
}
 
 
function setFont(c_value)
{
 
switch(c_value)
{
case 'big':
 
var navNam = navigator.appName;
var navVer= parseFloat(navigator.appVersion);
 
if (navNam.indexOf('Microsoft') != -1 ) {
        //IE 
        document.write('<link rel="stylesheet" type="text/css" href="/imagesvariables_fonts_main_ie_big.css" />');
}    else {
        //Netscape
        document.write('<link rel="stylesheet" type="text/css" href="/images/variables_fonts_main_net_big.css" />');
}
 
 
 
 
 
break;
case 'small':
var navNam = navigator.appName;
var navVer= parseFloat(navigator.appVersion);
 
 
if (navNam.indexOf('Microsoft') != -1 ) {
        //IE 
        document.write('<link rel="stylesheet" type="text/css" href="/images/variables_fonts_main_ie.css" />');
}    else {
        //Netscape
        document.write('<link rel="stylesheet" type="text/css" href="/images/variables_fonts_main_ie.css" />');
}
 
 
 
 
 
break;
 
 
}
 
}
 
function toggleFont()
{
var value;
value=readCookie("size");
var name;
var c_value;
 
 
switch(value)
{
 
case 'big':
alert("i am inside big");
document.cookie ='size=small; expires=Fri, 3 Aug 2020 20:47:11 UTC; path=/';
setFont("small");
break;
 
 case 'small':
 alert("i am inside small");
  document.cookie ='size=big; expires=Fri, 3 Aug 2020 20:47:11 UTC; path=/';
  setFont("big");
  break;
 
default:
alert("cookie not found!");
document.cookie ='size=small; expires=Fri, 3 Aug 2020 20:47:11 UTC; path=/';
 
 
}
 
}    

[HTML] //-->
</script>
<a class=pagenav href="#" onClick="javasc ript:toggleFont ();" >Text size</a></span>
[/HTML]


but the above code works in fire fox, but it is gives a blank page in ie,can any one help me with the issue?

[Revathi Balakrishnan]

Thanks for the reply acoder, i have used duplicate rel attribute. after seeing your advice, i have removed them after that the code works fine with ie, to have different style sheets for ie and Fire fox i have read the link given here.


Thanks a lot for help...

and i have one more requirement, Is it possible to swap image with the help of style sheets ? if i have style sheet a1, i should use image a1, if i have style sheet a2 i should use image a2. Is it possibel to do it?

[acoder]

Yes, it should be possible. The best way would be to try it.

[Revathi Balakrishnan]

i have achived image swapping with the below code

<img  name="picture" src="icon1.gif" onClick="swapimage();"></a>
 
swapimage()
{
window.document.picture.src="icon2.gif";
 
}
 

This is a very small tip, but hope it would be useful for new joinees of the javascript world

[acoder]

I thought you were going to use stylesheets.

In your script, you should try to use IDs to refer to elements. See this simple example