Comunidad de diseño web y desarrollo en internet online

No me carga contenido javascript en div con ajax

Citar            
MensajeEscrito el 16 Feb 2014 08:45 am
Hola amigos, resulta que quiero cargar 3 sliders distintos en un div mediante ajax, lo he implementado bien, funciona pero al tener el slider programación javascript no me lo muestra al intentar cargar con el código ajax. He intentado muchas cosas pero sigue sin funcionar, llevo mucho tiempo intentando solucionarlo sin éxito. Aquí os dejo el código y todo lo demás en un rar por si le queréis echar un vistazo:

https://dl.dropboxusercontent.com/u/27792874/ejemplo.rar

Me trae loca esto... :shock: Graciass

Por Anamary

3 de clabLevel



 

chrome
Citar            
MensajeEscrito el 17 Feb 2014 06:18 pm
Cierra bien los div en galeria.html y en galeria[1, 2 y 3].php

galeria.html

Código HTML :

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>BLOG</title>
    <link href="estilo-pagina-css" rel="stylesheet" type="text/css" /><script src="jquery.min.js"></script>
    <script type="text/javascript" src="jquery.cycle.all.js"></script>
    <script language="javascript">
      $(document).on("ready", Slider);

      function Cargar(url) {
        $.ajax({
          type: "GET",
          url: url,
          success: function(data) {
            $('#centro_galeria').html(data);
            Slider();
          }
        });
      }

      function Slider() {
        $('#slider1').cycle({
          fx: 'fade',
          speed: '600',
          timeout: '7000',
          next: '#next',
          prev: '#prev',
          pager: '#thumb',
          pauseOnHover: false,
          startClockOnMouseOut: false,
          pagerAnchorBuilder: function(idx, slide) {
            return '<li><a href="#"><img src="' + slide.src + '" width="43" height="29" /></a></li>';
          }
        });
      }
    </script>
    <style type="text/css">
      #contenedor {
        width: 900px;
        margin: 0 auto;
        height: 100%;
        background-color: #000000;
      }
    </style>
    <link href="estilo-galeria.css" rel="stylesheet" type="text/css" />
  </head>
  <body>
    <div id="contenedor">
      <div id="cabecera" ></div>
      <div id="botonera"><?php include($_SERVER['DOCUMENT_ROOT']."/botonera.php"); ?></div>
      <div id="sombra-galeria-botonera">
        <div class="botonera-galeria">
          <ul class="menu-galeria">
            <li><a href="#" onclick="Cargar('galeria1.php');">CONTENIDO 1</a></li>
            <li><a href="#" onclick="Cargar('galeria2.php');">CONTENIDO 2</a></li>
            <li><a href="#" onclick="Cargar('galeria3.php');">CONTENIDO 3</a></li>
          </ul>
        </div>
      </div>
      <!-- -->
      <div id="para-contenido"></div>
      <!-- // centro_galeria -->
      <div id="centro_galeria">
        <div class="container">
          <div class="slider">
            <div id="slider1">
              <img src="imagenes-galeria/1.jpg" />
              <img src="imagenes-galeria/2.jpg" />
              <img src="imagenes-galeria/3.jpg" />
            </div>
            <ul id="thumb"></ul>
            <div id='next' class="slider_next"><img src="imagenes-presentacion/next.png" width="78" height="100" alt="next image" /></div>
            <div id='prev' class="slider_prev"><img src="imagenes-presentacion/prev.png" width="78" height="100" alt="previous image" /></div>
          </div>
        </div>
      </div>
      <!-- // FIN centro_galeria -->
    </div>
  </body>
</html>


Ej: galeria1.php

Código HTML :

<div id="centro_galeria">
  <div class="container">
    <div class="slider">
      <div id="slider1">
        <img src="imagenes-galeria/7.jpg" />
        <img src="imagenes-galeria/2.jpg" />
        <img src="imagenes-galeria/3.jpg" />
        <img src="imagenes-galeria/4.jpg" />
        <img src="imagenes-galeria/5.jpg" />
        <img src="imagenes-galeria/6.jpg" />
      </div>
    </div>
    <ul id="thumb"></ul>
    <div id='next' class="slider_next"><img src="imagenes-presentacion/next.png" width="78" height="100" alt="next image" /></div>
    <div id='prev' class="slider_prev"><img src="imagenes-presentacion/prev.png" width="78" height="100" alt="previous image" /></div>
  </div>
</div>

Por btk22

0 de clabLevel



 

safari

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.