Problema con visualizacion de js

GidHarvey · #1 (**permalink**) 18/10/2009, 15:36

Buenas Tardes amigos de FDW.
Resulta que tengo un problema al poder visualizar el lightbox, por que arriba de el se encuentra el s3slider, el problema es que eh probado todo y de ninguna forma se muestra la imagen con el efecto que hace lightbox, la muestra de manera comun y corriente, la abre sobre la misma ventana. Alguien sabe como puedo arreglar este problema porfavor?

Aqui pongo mi html
eh visto varias formas de arreglarlo una de ellas sacando el script del slider
que es la unica con lo que funciona el efecto del lightbox. pero no voy a sacar el efecto del s3slider por que tambien va en la pagina.

Código HTML:

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/s3Slider.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $('#slider1').s3Slider({
            timeOut: 5000 
        });
    });
</script>

y hay se ve el efecto del lightbox, el problema es que el efecto del lightbox no se ve encima del s3slider, y lo que hace es que abre la imagen en la misma ventana como puedo arreglar este problema :s...?

Aqui el HTML

deirdre · #2 (**permalink**) 18/10/2009, 17:55

Hola GidHarvey

Este problema es consecuencia de la incompatibilidad de los js prototype y jquery montados en la misma página.

Puedes resolverlo fácilmente sustituyendo lightbox por lytebox, lo que tiene también otras ventajas como la enorme reducción de peso en la carga de los js.

He montado una prueba en tu propio código y funciona perfectamente en coexistencia con el slider jquery, de esta forma:

Código HTML:

Elimino todo esto:
<!--
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
-->

Y, en su lugar coloco esto:

<script type="text/javascript" src="js/lytebox.js"></script>
<link rel="stylesheet" type="text/css" href="css/lytebox.css" media="screen" />


Tienes que ajustar a tu gusto la hoja de estilo y, en particular, esta clase:

.w8 {
	margin-left: 4px; /* 8px en el original /*
}

Y este es el cambio en uno de los divs de imágenes:

        <div id="boxrandom">
        
        <a href="images/1.jpg" rel="lytebox[random_image]"><img src="images/random_image.jpg" width="72" height="71" border="0" /></a>
        <a href="images/2.jpg" rel="lytebox[random_image]"><img src="images/random_image2.jpg" width="72" height="71" border="0" class="w8" /></a>
        <a href="images/3.jpg" rel="lytebox[random_image]"><img src="images/random_image3.jpg" width="72" height="71" border="0" class="w8" /></a>
        
        </div>

Si tienes alguna dificultad, la comentas para intentar ayudarte.

Bye

GidHarvey · #3 (**permalink**) 19/10/2009, 10:50

Hola deirdre. Buenas Tardes
Muchas gracias por la ayuda ahora si funciona todo en mi pagina, el problema era la incompatibilidad de los js prototype y jquery, bueno no conocia ese lytebox es mucho mejor que el lightbox. la opcion de ajustar esta clase la omiti por que es la separacion de cada imagen peque~a de la random box.

Código HTML:

.w8 {
	margin-left: 4px; /* 8px en el original /*
}

Un saludo.

ATTe Gidharvey

PD: como hago para que funcione lo del pause y lo del play?

deirdre · #4 (**permalink**) 19/10/2009, 11:17

No entiendo a qué te refieres con lo del play-pause.

Si no cambias un poco la clase w8, podrías tener problema de colocación de las miniaturas (carga tu página en 1024 y verás lo que te digo).

Bye

GidHarvey · #5 (**permalink**) 19/10/2009, 11:35

era lo de

Código HTML:

rel="lytebox[random_image]

y yo lo que queria era

Código HTML:

rel="lyteshow[random_image]

para que se activara el play y el pause.

puse mi pagina en 1024 y no tiene ningun problema me podrias poner alguna captura para ver a lo que te refieres porfavor, por que la clase .w8 es la separacion de cada imagen miniatura, pero no la puedo cambiar por que cambiaria el dise~o y la pagina.

Un saludo

ATTe Gidharvey

deirdre · #6 (**permalink**) 19/10/2009, 16:07

Hola GidHarvey

Capturas en pantalla de 1024:

Primera captura, utilizando la clase w8 tal como la tienes originalmente (margin-left: 8px;):

http://img44.imageshack.us/img44/56/w8original.jpg

Segunda captura, modificando la clase (margin-left: 4px;):

http://img44.imageshack.us/img44/8854/w8modificado.jpg

Bye

GidHarvey · #7 (**permalink**) 19/10/2009, 18:54

Hola deirdre.
haber mira revisa aqui y dime como se te ve http://www.kopfmackloss.com/ es que la probre hasta en 800x600 y no pasa nada de eso, la eh provado en todos los monitores y se ve bien, nada se desencuadra :s, a que te refieres con que la ponga en 1024?

saludos.

deirdre · #8 (**permalink**) 19/10/2009, 20:48

No me carga la página... mañana intentaré de nuevo volver a visitar la página.

bye

GidHarvey · #9 (**permalink**) 20/10/2009, 07:42

el enlace internacional esta lento, dale unos minutos mientras carga.

saludos.