Buenas tardes, tras un tiempo inactivo vuelvo para preguntaros una duda que me ha surgido y la verdad es que no entiendo bien porque..
Estoy creando una página en la que cargo los estilos de la forma habitual
Código:
<link rel="stylesheet" href="css/reset.css" type="text/css" media="all">
<link rel="stylesheet" href="css/layout.css" type="text/css" media="all">
<link rel="stylesheet" href="css/style.css" type="text/css" media="all">
y la página me funciona correctamente, carga los estilos etc..
pero el caso es que he implementado un sistema AJAX para cargar toda la web en una misma página, dejando la cabezera y el pie de página estático y cargando en un Div el contenido, y cuando me carga la página en el Div no me cargan los estilos.
He probado a poner los estilos en el index.html en el que esta la cabecera y el pie de página, a cargarlos en el inicio.html (página que se carga en el Div 'contenido' de la página), y a cargarlos en los dos sitios.. pero no me funciona, me muestra todo sin estilos :S.
Alquien sabe que puedo hacer, o que puede ser?
Os dejo tambien el script Ajax por si tubiese que modificar algo ahí.
Código:
// AJAX Para Cargar Páginas dentro de un Div.
function Carga(url,id)
{
//Creamos un objeto dependiendo del navegador
var objeto;
if (window.XMLHttpRequest)
{
//Mozilla, Safari, etc
objeto = new XMLHttpRequest();
}
else if (window.ActiveXObject)
{
//Nuestro querido IE
try {
objeto = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try { //Version mas antigua
objeto = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}
if (!objeto)
{
alert("No ha sido posible crear un objeto de XMLHttpRequest");
}
//Cuando XMLHttpRequest cambie de estado, ejecutamos esta funcion
objeto.onreadystatechange=function()
{
cargarobjeto(objeto,id)
}
objeto.open('GET', url, true) // indicamos con el método open la url a cargar de manera asíncrona
objeto.send(null) // Enviamos los datos con el metodo send
}
function cargarobjeto(objeto, id)
{
if (objeto.readyState == 4) //si se ha cargado completamente
document.getElementById(id).innerHTML=objeto.responseText
else //en caso contrario, mostramos un gif simulando una precarga
document.getElementById(id).innerHTML='<img align="center" src="./images/loader.gif" alt="cargando" />'
}
Y esta es la manera de llamarlo en el html
Código:
<a href="javascript:Carga('contacts2.html', 'contenido');">Contacto</a>
Un saludo.