Tengo que hacer una web en 2 idiomas (castellano y valenciano) y lo estoy haciendo con javascript y CSS, con un ejemplo que encontré a través de internet.
Para ello creo 2 CSS:
-Una llamada "castellano" cuyo contenido es: .valenciano { display:none; }
-Otra "valenciano" cuyo contenido es: .castellano {display:none; }
Y en cada página añado lo siguiente:
<link rel="stylesheet" type="text/css" href="castellano.css" title="castellano"/>
<link rel="alternate stylesheet" type="text/css" href="valenciano.css" title="valenciano"/>
Por ejemplo, en una página escribo algo como lo siguiente:
<p class="castellano">Texto escrito en castellano</p>
<p class="valenciano">Text escrit en valencià</p>
Esto hace que solo se muestre el texto correspondiente al idioma seleccionado.
Para ello se dispone de un enlace para escoger el idioma como el que sigue:
<a href="#" onclick="setActiveStyleSheet('valenciano'); return false;" class="valenciano" target="mainFrame">Valencià</a>
<a href="#" onclick="setActiveStyleSheet('castellano'); return false;" class="castellano" target="mainFrame">Castellano</a>
Al clickar en uno de estos enlaces se invoca a un javascript con el siguiente contenido, el cual permite alternar entre los CSS de "castellano" y "valenciano":
[I]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;
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();
setActiveStyleSheet(title);
Todo ello funciona correctamente. El problema es que dispongo de 2 frames, uno superior y otro principal. En el superior están los enlaces que permiten cambiar el idioma además de los enlaces al resto de las páginas de la web. El caso es que cuando pincho para cambiar el idioma, se me cambia en el frame superior, pero el frame principal sigue como estaba, y aunque pinche otra vez en alguno de los enlaces sigue mostrándose en el mismo idioma. Es decir, el frame superior funciona correctamente, pero el principal siempre lo muestra en castellano.
A ver si alguien me puede echar una mano.
Gracias.
