Problema al ampliar una imagen

Alberto_Mad · #1 (**permalink**) 04/05/2012, 07:38

Hola,
estoy realizando una web, pero tengo una serie de problemas a la hora de realizar un lightbox

El problema radica en que este lightbox en la pagina principal funciona sin ningún tipo de problema pero a la hora de realizar el efecto en algún otra página, este efecto no funciona y por más vueltas que le doy no encuentro el por qué,

Index.php

Código PHP:

Ver original...
    <script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
        <script type="text/javascript" src="js/slimbox2.js"></script>
        <script type='text/javascript' src='js/kwicks.js'></script>
        <script type='text/javascript' src='js/custom.js'></script>
        <script type="text/javascript" src="js/execute.js"></script>
    ...
     
    <script src=" js/sofas.js" type="text/javascript"></script>
     
    ....
     
    </head>
    <body>
    ...
    <li><a href="#" onClick="sofas();">Sofas</a></li>
    ...
     
    <!--ESTE EFECTO EN ESTA PÁGINA FUNCIONA CORRECTAMENTE
    <a href="example.jpg" rel="lightbox-cats"><img src="example.jpg" class="mini" width="100" height="100"></a>-->
     
    ...
    </body>
    ...

sofas.js

Código Javascript:

Ver originalfunction sofas(){
        //print "hola";
        var contenedor;
        contenedor = document.getElementById('contenido');
        ajax5=nuevoAjax();
        ajax5.open("GET", "sofas.php",true);
        ajax5.onreadystatechange=function() {
            if (ajax5.readyState==4) {
                contenedor.innerHTML = ajax5.responseText;
            }
        }
        ajax5.send(null);
    }

sofas.php

Código PHP:

Ver original<div id="contenido">
    <h3><center>SOF&Aacute;S</center></h3>
        <br />
        <br />
        <!--<center>SOY UN SOFA</center>-->
       
        <table  border="0" cellpadding="5" width="760px">
            <tr valign="middle">
    ....
    ESTE EFECTO EN ESTA PAGINA NO ME FUNCIONA
    <a href="example.jpg" rel="lightbox-cats"><img src="example.jpg" class="mini" width="100" height="100">

Si alguien me pudiera echar una mano

Muchas gracias.

sapales · #2 (**permalink**) 04/05/2012, 12:28

Hola:

Intento ayudarte me surgen muchas dudas. En "Index.php" importar varios .js y no los veo en "sofas.php". Tampoco veo el "<li><a href="#" onClick="sofas();">Sofas</a></li>" que ejecuta el Ajax.

Salvo esto, no veo nada raro. ¿Puedes enviar más información?

Alberto_Mad · #3 (**permalink**) 07/05/2012, 02:06

En la página de "sofas.php" solo utilizo un <div> que es el que se sustituye de la página principal.

Código PHP:

Ver original<div id="contenido">
<h3><center>SOF&Aacute;S</center></h3>
    <br />
    <br />
...
        ¡¡¡¡¡¡  ESTE EFECTO EN ESTA PAGINA NO ME FUNCIONA  !!!!!!!
    <a href="example.jpg" rel="lightbox-cats"><img src="example.jpg" class="mini" width="100" height="100"></a>
    <!--<a href="images/Sofas/Baltic piel.jpg" rel="lightbox-cats"><img src="images/Sofas/Baltic piel.jpg" class="mini" width="100" height="100"></a>-->
</div>

No tiene más código que este, ya que todo la web lo manejo desde "index.php" y con las otras páginas lo único que hago es cambiar un parte de sección de la página inicial

Cuando pulsa el botón referente a la página "sofa.php" lo único que hago en la página "index.php" es sustituir el "<div>" en cargado de mostrar el contenido principal ("<div id="contenido">") por el contenido que contiene la página de "sofas.php" (por lo que creo que no es necesario que dicha página contenga los javascript, ya que estos estarán contenidos en la página inicial "index.php")

La página "index.php" es:

Código PHP:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
...
 
    <script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
    <script type="text/javascript" src="js/slimbox2.js"></script>
    <script type='text/javascript' src='js/kwicks.js'></script>
    <script type='text/javascript' src='js/custom.js'></script>
    <script type="text/javascript" src="js/execute.js"></script>
    
        ...
    
        <script src="js/jquery.js" type="text/javascript"></script>
    <script src="js/jquery.ubillboard.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function($){
            $('#billboard').uBillboard({
                effect: 'horizontal'
            });
        });
    </script>
    
        ...
 
       <script src=" js/ajax.js" type="text/javascript"></script>
 
       <script src=" js/contacto.js" type="text/javascript"></script>
       <script src=" js/producto.js" type="text/javascript"></script>
       <script src=" js/sofas.js" type="text/javascript"></script>
       <script src=" js/butacas.js" type="text/javascript"></script>
       <script src=" js/sillas.js" type="text/javascript"></script>
       <script src=" js/pregfrec.js" type="text/javascript"></script>
     
       ...
 
</head>
<body>
    <div id="general">
        <div id="cabecera">
        </div>
        
        <div id="navigacija">
                ...
                            <li>
                                <div class="menu">
                                    <ul>
                                        <li>
                                           <a href="#">Productos</a>
                                               <ul>
                                                    <li><a href="#" onClick="sofas();">Sofas</a></li>
                                                    <li><a href="#" onClick="butacas();">Butacas</a></li>
                                                    <li><a href="#" onClick="sillas();">Sillas</a></li>
                                                </ul>
                                        </li>
                                    </ul>
                                </div>
                            </li>
                             ...              
        </div> 
            
        <div id="contenido">
            ...
        </div>
                ...
        ¡¡¡¡¡¡  ESTE EFECTO EN ESTA PAGINA ME FUNCIONA  !!!!!!!
        <a href="example.jpg" rel="lightbox-cats"><img src="example.jpg" class="mini" width="100" height="100"></a>
    </div>
</body>
</html>