Foros del Web » Programando para Internet » Javascript » Frameworks JS »

LightBox

Estas en el tema de LightBox en el foro de Frameworks JS en Foros del Web. Hola: La cosa es que tengo un proble configurando el lightbox npara mi página. Sigo todos los pasos de los ejemplos enlazo con todos los ...
  #1 (permalink)  
Antiguo 12/08/2010, 02:33
 
Fecha de Ingreso: septiembre-2009
Mensajes: 6
Antigüedad: 15 años, 2 meses
Puntos: 0
LightBox

Hola:
La cosa es que tengo un proble configurando el lightbox npara mi página.
Sigo todos los pasos de los ejemplos enlazo con todos los archivos. Hasta aquí todo bién pero cuando pincho en un enlace en vez de aparecerme el lightbox me lleva a otra página(la foto).
He probado a capturar el link por el id de la capa al que pertenecen, por el rel, pero incluso cualquier link pero nada.

Espero que alguno vea el error o se le ocurra alguna idea por que no se como solucionarlo

Código HTML:
<!DOCTYPE html><html><head><meta charset='utf-8' /><link rel='stylesheet' type='text/css' href='http://localhost/ucco/css/menu.css' media='screen'/><title>Bienvenidos a UCCO</title><!--<link type="text/css" rel="stylesheet" href="http://localhost/ucco/galeria/demo.css">--> 
<link type="text/css" rel="stylesheet" href="http://localhost/ucco/galeria/ligthbox/css/jquery.ligthbox-0.5.css" media="screen"> 
<!--<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript"></script>--> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script> 
<script type="text/javascript" src="http://localhost/ucco/galeria/js/lightbox.js"></script> 
 
<!-- Activación del jQuery lightBox plugin --> 
<script type="text/javascript"> 
    $(function() {
        $('#gallery a').lightBox();
    });
</script> 
<style type="text/css"> 
    /* jQuery lightBox plugin - Gallery style */
    #gallery {
        background-color: #444;
        padding: 10px;
        width: 796px;
    }
    #gallery ul { list-style: none; }
    #gallery ul li { display: inline; }
    #gallery ul img {
        border: 5px solid #3e3e3e;
        border-width: 5px 5px 20px;
    }
    #gallery ul a:hover img {
        border: 5px solid #fff;
        border-width: 5px 5px 20px;
        color: #fff;
    }
    #gallery ul a:hover { color: #fff; }
</style> 
 
</head><body> 
        <div id='gallery'> 
        <ul> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/01.jpg" title="" rel="lightbox"> 
                            <img src="photos/01.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/02.jpg" title="" rel="lightbox"> 
                            <img src="photos/02.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/03.jpg" title="" rel="lightbox"> 
                            <img src="photos/03.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/04.jpg" title="" rel="lightbox"> 
                            <img src="photos/04.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/05.jpg" title="" rel="lightbox"> 
                            <img src="photos/05.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/06.jpg" title="" rel="lightbox"> 
                            <img src="photos/06.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/1.jpg" title="" rel="lightbox"> 
                            <img src="photos/1.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/10.jpg" title="" rel="lightbox"> 
                            <img src="photos/10.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/11.jpg" title="" rel="lightbox"> 
                            <img src="photos/11.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/12.jpg" title="" rel="lightbox"> 
                            <img src="photos/12.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/13.jpg" title="" rel="lightbox"> 
                            <img src="photos/13.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/14.jpg" title="" rel="lightbox"> 
                            <img src="photos/14.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/2.jpg" title="" rel="lightbox"> 
                            <img src="photos/2.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/3.jpg" title="" rel="lightbox"> 
                            <img src="photos/3.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/4.jpg" title="" rel="lightbox"> 
                            <img src="photos/4.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/5.jpg" title="" rel="lightbox"> 
                            <img src="photos/5.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/6.jpg" title="" rel="lightbox"> 
                            <img src="photos/6.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/7.jpg" title="" rel="lightbox"> 
                            <img src="photos/7.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/8.jpg" title="" rel="lightbox"> 
                            <img src="photos/8.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/9.jpg" title="" rel="lightbox"> 
                            <img src="photos/9.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/image1.jpg" title="" rel="lightbox"> 
                            <img src="photos/image1.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/image2.jpg" title="" rel="lightbox"> 
                            <img src="photos/image2.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/image3.jpg" title="" rel="lightbox"> 
                            <img src="photos/image3.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/image4.jpg" title="" rel="lightbox"> 
                            <img src="photos/image4.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
                                <li> 
                        <a href="http://localhost/ucco/galeria/photos/image5.jpg" title="" rel="lightbox"> 
                            <img src="photos/image5.jpg" width="72" height="72" alt="" /> 
                        </a> 
                    </li> 
            </ul></div><!--cierra Gallery--> 
</body> 
</html> 
  #2 (permalink)  
Antiguo 12/08/2010, 04:07
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.607
Antigüedad: 22 años, 8 meses
Puntos: 1284
Tema movido desde javascript
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #3 (permalink)  
Antiguo 12/08/2010, 10:54
Avatar de JessicaTJ  
Fecha de Ingreso: enero-2007
Ubicación: 127.0.0.1
Mensajes: 472
Antigüedad: 17 años, 11 meses
Puntos: 25
Respuesta: LightBox

Ps a mi me funciona bien como lo haces XD , trata de poner en vez del jquery UI usar este:

Código Javascript:
Ver original
  1. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js" type="text/javascript"></script>
__________________
٩(͡๏̯͡๏)۶ || ٩(͡๏̯͡๏)۶
  #4 (permalink)  
Antiguo 12/08/2010, 11:12
 
Fecha de Ingreso: agosto-2010
Ubicación: Mérida
Mensajes: 12
Antigüedad: 14 años, 4 meses
Puntos: 0
Respuesta: LightBox

AlejandroM:

Me ha sucedido algo similar al tratar de incrustar un codigo de un plugin ajax o jquery en una página, yo supongo que alguno de los links de JQuery (<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script> ó <!--<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript"></script>-->) pueden estarse contradiciendo. Para decirte más certeramente ne cesitaria ver el contenido de "http://localhost/ucco/galeria/js/lightbox.js".
  #5 (permalink)  
Antiguo 13/08/2010, 10:57
 
Fecha de Ingreso: septiembre-2009
Mensajes: 6
Antigüedad: 15 años, 2 meses
Puntos: 0
De acuerdo Respuesta: LightBox

O.K ya lo he conseguido el problema es que lightbox está un poco anticuado, vamos que se dejó de actualizar y con el menu lavaLamp cascaba. Total que con el fancyBox no he tenido problemas.
Gracias por su ayuda y un saludaco.

Etiquetas: galeria, jquery, lightbox
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 08:32.