Quiero deciros que es la primera vez que trabajo con Ajax, y he estado mirando mucho por Inet, pero no consigo dar con la solucion.
El problema consiste, en que tengo una web, con un menu que al picar en cada opcion, se tiene que abrir en un frame un carrusel de imagenes que existe en un html. El carrusel funciona correctamente si abro directamente el html que lo contiene, pero al cargarlo con Ajax, dentro del frame me aparecen todas las imagenes una a continuacion de otra, y no funciona el carrusel.
La funcion de Ajax que tengo para cargar es:
Código :
// JS Carga Asincrona de Archivos mediante AJAX
var peticion = false;
try {
//Crea el objeto XMLhttpRequest para navegadores Firefox, Safari u Opera
peticion = new XMLHttpRequest();
} catch (trymicrosoft) {
try {
//Crea el objeto XMLhttpRequest para IE 6 ó superior
peticion = new ActiveXObject("Msxml2.XMLHTTP");
} catch (othermicrosoft) {
try {
//Crea el objeto XMLhttpRequest para IE 5
peticion = new ActiveXObject("Microsoft.XMLHTTP");
} catch (failed) {
peticion = false;
}
}
}
if (!peticion)
alert("ERROR AL INICIALIZAR!");
function loadContent(fragment_url, element_id, qs) {
//Se agrega random para saltar caché de AJAX
//alert(fragment_url);
var aleatorio= Math.random();
var element = document.getElementById(element_id);
//element.innerHTML = '<p><img src="hourglass.png" align="absmiddle" border="0" /><b> Cargando</b></p>';
//alert(fragment_url +'?id='+aleatorio+'&'+qs);
peticion.open("GET", fragment_url +'?id='+aleatorio+'&'+qs );
peticion.onreadystatechange = function() {
if (peticion.readyState == 4) {
element.innerHTML = peticion.responseText;
}
}
peticion.send(null);
}Y el html donde esta el carrusel es:
Código HTML :
<html>
<head>
<link rel="stylesheet" href="css/jd.gallery.css" type="text/css" media="screen" />
<link rel="stylesheet" href="css/obras.css" type="text/css" />
<script src="js/mootools.v1.11.js" type="text/javascript"></script>
<script src="js/jd.gallery.js" type="text/javascript"></script>
</head>
<body>
<script type="text/javascript">
function startGallery() {
var myGallery = new gallery($('myGallery'), {
timed: true,
showArrows: true,
showCarousel: false,
showInfopane: false,
delay: 3000,
embedLinks: false
});
}
window.addEvent('domready', startGallery);
</script>
<div id="contenedor_carrusel"><div id="myGallery">
<div class="imageElement"><img class="full"src="images/proyectos/obra1/reformas_salamanca_valladold_decoracion_1.jpg" /></div>
<div class="imageElement"><img class="full" src="images/proyectos/obra1/reformas_salamanca_valladold_decoracion_2.jpg" /></div>
<div class="imageElement"><img class="full" src="images/proyectos/obra1/reformas_salamanca_valladold_decoracion_3.jpg" /></div>
<div class="imageElement"><img class="full" src="images/proyectos/obra1/reformas_salamanca_valladold_decoracion_4.jpg" /></div>
<div class="imageElement"><img class="full" src="images/proyectos/obra1/reformas_salamanca_valladold_decoracion_5.jpg" /></div>
<div class="imageElement"><img class="full" src="images/proyectos/obra1/reformas_salamanca_valladold_decoracion_6.jpg" /></div>
<div class="imageElement"><img class="full" src="images/proyectos/obra1/reformas_salamanca_valladold_decoracion_7.jpg" /></div>
<div class="imageElement"><img class="full" src="images/proyectos/obra1/reformas_salamanca_valladold_decoracion_8.jpg" /></div>
<div class="imageElement"><img class="full" src="images/proyectos/obra1/reformas_salamanca_valladold_decoracion_9.jpg" /></div>
<div class="imageElement"><img class="full" src="images/proyectos/obra1/reformas_salamanca_valladold_decoracion_10.jpg" /></div>
<div class="imageElement"><img class="full" src="images/proyectos/obra1/reformas_salamanca_valladold_decoracion_11.jpg" /></div>
</div></div>
</body>Supongo que tenga algo que ver, en relacion con las librerias que utiliza el carrusel, pero no se, la verdad que estoy bastante perdido. Si me podeis ayudar os lo agradeceria!!!
Gracias
