11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour à tous,
Après 5 années à consulter les forum et chercher les réponses dans les sujets existants.
Je craque aujourd'hui sur un problème, et je créé mon premier sujet.

Je m'occupe de ce site
http://www.jonathandutilleul.com/

Sous safari quand je clique sur le thème "noir" dans la barre du haut visiblement le fichier CSS n'est pas trouvé.
A la base j'ai deux fichier css que l'utilisateur peut alterner(en javascript).

Mais sous safari c'est visiblement tjrs le deuxième fichier qui n'est pas chargé:
<link rel="stylesheet" type="text/css" href="templates/simple/styles/light.css" title="light" />
<link rel="alternate stylesheet" type="text/css" href="templates/simple/styles/dark.css" title="dark" />

Visiblement safari n'aime pas le "alternate stylesheet". Je pensais pouvoir réglé ce problème mais visiblement je ne cherche pas assez bien la réponse et je n'y arrive pas.

Merci à vous de s'intéresser à mon problème.
Salut,

As-tu pensé à modifier la valeur de l'attribut rel lorsque tu bascules d'un style à l'autre, autrement dit en ajoutant ou retranchant le mot « alternate » ?
Voici la fonction javascript qui effectue le changement :

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;
			}
		}
	}
}


J'ai modifié en faisant comme tu as dis(si j'ai bien compris) :

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;
			a.setAttribute("rel", "alternate stylesheet");
			if (a.getAttribute("title") == title) {
				a.disabled = false;
				a.setAttribute("rel", "stylesheet");
			}
		}
	}
}


Mais le résultat est qu'il n'y a plus que sur Firefox que ça fonctionne correctement...[/i][/i]
Il y a un Bug dans SAFARI (depuis la 5) sur le fonctionnement des StyleSwitcher.

J'ai écrit ma version Perso qui marche (et sauvegarde le style dans un Cookie).

// Auteur : Mathieu Fay
// Adaptation perso pour bug Safari
// ------------------------------------------------------
var swctobj     = null ;
var swcttabtitl = new Array() ;
var swcttabhref = new Array() ;
function setActiveStyleSheet(title) 
{  ecritCookie(title);
   var i, a, href;
   var swcti = -1 ; 
   if (swctobj == null)
   {  for(i=0; (a = document.getElementsByTagName("link")[i]); i++)
      {  if (a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title"))
         {  a.disabled = true ;
            swcti++ ;
            swcttabtitl[swcti] = a.title ;
            swcttabhref[swcti] = a.href ;     
            if(a.title == title)
            {  href = a.href ;
      }  }  } 
      var parent = document.getElementsByTagName("head")[0]
      swctobj = document.createElement("link") ;
      swctobj.setAttribute("type", "text/css") ; 
      swctobj.setAttribute("rel", "stylesheet") ; 
      swctobj.href = href ;
      parent.appendChild(swctobj)
   }
   else
   {  for(i in swcttabtitl)
      {  if (swcttabtitl[i] == title)
         {  swctobj.href = swcttabhref[i] ; 
}  }  }  }

// Ecriture du COOKIE pour 5 ans
// -----------------------------

function ecritCookie(NomStyle) 
{  var expires = new Date();
   expires.setTime(expires.getTime()+(5*365*24*3600*1000));
   document.cookie = 'FeuilleStyle=' + NomStyle + '; expires=' + expires.toGMTString();
}


// Recuperation du COOKIE, est appele en premier dans la page
// ----------------------------------------------------------
function recupCookie()
{  if(document.cookie != '')
   {  var cookies = document.cookie.split(/; */);
      for(var i=0; i < cookies.length; i++)
      {  cookies[i] = cookies[i].split(/=/);
         if(cookies[i][0] == 'FeuilleStyle')
         {  setActiveStyleSheet(cookies[i][1]) ;
}  }  }  }
recupCookie();
[/i][/i][/i][/i][/i][/i][/i]
Modifié par Borak (23 Oct 2011 - 20:09)