¿En una pagina Web cargar Otra pagina con animacion JQuery - AYUDA? Buenas Tardes, Dias o Noches Srs.
Ya tiempo q me registre en este interesante foro en el cual se aprenden muchas cosas, pero hoy tal vez tenga algo q ofrecer en mi interrogante y pues si me pueden ayudar seria genial .
Mi interrogante de ahora tal vez le haya sucedido a algunos o sino, les pueda suceder mas adelante, a lo q va de diseñar y programar con el famoso Jquery. : )
Estoy haciendo una página web, en la cual quiero q; al darle click en cierto hipervínculo (<a> ó cualquier elemento); me carge en un DIV una nueva pagina adherida (la cual contiene animaciones JQuery), todo eso en una sola pagina llamada “pagina1.html”
El código es el sgte:
“pagina1.html”:
<head>
<script type="text/javascript" src="../js/jquery.js"></script>
</head
<body>
<a class="ddd" href="#">MUESTRAME LA ANIMACION DE PAGINA2 EN EL DIV YOYO</a>
<div id="yoyo"> </div>
<script type="text/javascript">
$("a.ddd").click(function(){
$("#yoyo").load(
"pagina2.html"
)
})
</script>
</body>
Weno, Quiero q, en la “pagina1.html” me cargue la “pagina2.html” con unos efectos animados con JQuery lo cual los cogi desde esta página => ( h t t p :// css-tricks . com /revealing-photo-slider/ (sin espacios)) --bueno, en si cogi todo el archivo xD, pero igual se los recomiendo- Aquello fue lo q pegué en la pagina2.html .
Este es el código del “index.html” de la pagina q les recomendé antes, por si no desean visitar esa pagina y descargar todo el .rar q hay ahí;
“pagina2.html”:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Revealing Photo Slider with jQuery by CSS-Tricks</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript" src="js/jquery.js"></script>
</head>
<body>
<div id="page-wrap">
<h1>Revealing Photo Slider</h1>
<table><tr>
<td><div class="photo_slider">
<img src="images/mthood.jpg"/>
<div class="info_area">
<h3>Climbing Mt. Hood</h3>
<p><em>By: <a href="#">Brother O'Mara</a></em></p>
</div>
</div></td>
<td><div class="photo_slider">
<img src="images/baloon.jpg"/>
<div class="info_area">
<h3>Climbing Mt. Hood</h3>
<p><em>By: <a>Brother O'Mara</a></em></p>
</div>
</div></td>
<td><div class="photo_slider">
<img src="images/lighthouse.jpg"/>
<div class="info_area">
<h3>Lighthouse Rays</h3>
<p><em>By: <a href="#">(nz)dave</a></em></p>
</div>
</div></td>
<td><div class="photo_slider">
<img src="images/giraffe.jpg"/>
<div class="info_area">
<h3>Pucker up!</h3>
<p><em>By: <a href="#">ucumari</a></em></p>
</div>
</div></td>
</tr></table>
</div>
<script type="text/javascript" src="js/photorevealer.js"></script>
</body>
</html>
Como verán… Si ejecuto solo la pagina2.html , esta todo OK, - realiza su efecto en perfecto estado- , pero si, lo ejecuto desde el link de la primera pagina (ese q dice: MUESTRAME LA ANIMACION DE PAGINA2 EN EL DIV YOYO), Lo ejecuta como si no se hubiera hecho nada en Jquery - :( =S …
Por favor estaría extremadamente agradecido con Uds si es q por ahí me brinden alguna pista, sugerencia, opinión , ayuda … el cual me dirija a la solución.
PD: porsiacaso no lo quiero poner en la Pagina1.html porque quiero q mi web sea mas liviana.
Saludos
Carloz
