Styleswitcher funktioniert nicht mit dem InternetExplorer

Baron · #1 (**permalink**) 22.07.2007, 00:31

hi, ich bin neu hier, und nun zu meinem ersten problem
(ich hoffe der code ist selbstverstaendlich -> also es handelt sich darum ueber ein dropdownmenue das hintergrundbild zu aendern, was auch wunderbar klappt im opera und firefox, aber nicht im ie):

PHP-Code:


			
<html>

<head> 

<title>Switcher</title>



<link rel="stylesheet" href="1.css" type="text/css" title="1" />

<link rel="alternate stylesheet" href="2.css" type="text/css" title="2" />

<link rel="alternate stylesheet" href="3.css" type="text/css" title="3" />

<link rel="alternate stylesheet" href="4.css" type="text/css" title="4" />



<script type="text/javascript" language="javascript">

function setActiveStyleSheet(title)

{

    var i, a, main;



    for (i = 0; (a = document.getElementsByTagName('link')[i]); i++)

    {

        if ((a.getAttribute('rel').indexOf('style') != -1) && (a.getAttribute('title')))

        {

            a.disabled = true;



            if (a.getAttribute('title') == title)

                a.disabled = false;

        }

    }

}



function getActiveStyleSheet()

{

    var i, a;



    for (i = 0; (a = document.getElementsByTagName('link')[i]); i++)

        if ((a.getAttribute('rel').indexOf('style') != -1) && (a.getAttribute('title')) && (!a.disabled))

            return a.getAttribute('title');



    return null;

}



function getPreferredStyleSheet()

{

    var i, a;



    for (i = 0; (a = document.getElementsByTagName("link")[i]); i++)

        if ((a.getAttribute('rel').indexOf('style') != -1) && (a.getAttribute('rel').indexOf('alt') == -1) && (a.getAttribute('title')))

            return a.getAttribute('title');



    return null;

}



function createCookie(name, value, days)

{

    if (days)

    {

        var date = new Date();

        date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));

        var expires = '; expires=' + date.toGMTString();

    }

    else

        expires = '';



    document.cookie = name + '=' + value + expires + '; path=/';

}



function readCookie(name)

{

    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;

}



window.onload = function(e)

{

    var cookie = readCookie('style');

    var title  = (cookie) ? cookie : getPreferredStyleSheet();



    setActiveStyleSheet(title);

}



window.onunload = function(e)

{

    var title = getActiveStyleSheet();



    createCookie('style', title, 365);

}



var cookie = readCookie('style');

var title  = (cookie) ? cookie : getPreferredStyleSheet();



</script>

</head>



<body> 



<select style=background-color:000000;color:ffffff;position:absolute;top:60px;left:70px;z-index:1>

<option style=background-color:000000;color:ffffff>Design auswählen...</option>

<option style=background-color:006650;color:ffffff onclick="setActiveStyleSheet('1');">1</option>

<option style=background-color:860000;color:ffffff onclick="setActiveStyleSheet('2');">2</option>

<option style=background-color:9b4513;color:ffffff onclick="setActiveStyleSheet('3');">3</option>

<option style=background-color:0dfg00;color:ffffff onclick="setActiveStyleSheet('4');">4</option>

</select>



</body>

</html>

Danke für jede Hilfe

Ernie · #2 (**permalink**) 22.07.2007, 11:34

Morgen,

Warum dein Code nicht im IE funktioniert sehe ich jetzt auf die schnelle nicht, nur folgendes:

Den link tag über das tilte-attribut zu referenzieren, halte ich für ungeschickt. Nimm lieber id und beachte, daß hierfür keine reinen Zahlen erlaubt sind.

Den wechsel über onclick im option tag zu vollziehen ist auch nicht wirklich gut, nimm lieber onchange im select tag.

Weil heute Sonntag ist und ich gerade eiene Datei mit der von Dir gesuchten Funktion offen habe hier der Code für das onchange event:

Code:

function changeStyleSheet(){
var opts = this.getElementsByTagName('option'), actSheet = null;
  for (var i = 0; i< opts.length; i++) {
   var sheet = document.getElementById(opts.item(i).value);
   if (opts.item(i).selected) { actSheet = sheet; continue }
   sheet.rel = 'alternate stylesheet';
   sheet.disabled = true;
  }
  if (actSheet) {
   actSheet.disabled = false;
   actSheet.rel = 'stylesheet';
  }

}

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Ansicht
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Probleme mit dem Layout: divanordnung	Muckel	CSS	8	29.06.2008 11:28
csshover.htc + IE6 funktioniert nicht	sharks	CSS	1	13.03.2008 11:50
Div box dem inhalt anpassen?	homezonebenny	CSS	1	29.11.2007 09:11
Scrollbares Textfeld mit purem CSS	Dancer	CSS	6	24.01.2005 15:58
Probleme mit dem Einloggen	terrikay	Fragen, Konstruktive Kritik, Lob / Bekanntmachungen	18	24.10.2004 23:12