Problema con jQuery

[SiKuSS]

Muy buenas a todos!

Perdonen si no he posteado en el sitio adecuado. Estoy implementando en mi web un jQuery llamado "fancybox".

http://fancybox.net/


Estoy utilizando la función de iFrame, en este caso abre un formulario con el efecto del query.


El problema, viene a que no puedo utilizar el mismo el efecto 2 veces. Si hago la llamada una vez, el jQuery funciona perfectamente, pero al intentar volver a llamar a la misma función, hace que se convierta en un href normal, eliminando el efecto producido por el query.


Por poneros un ejemplo, esto me funciona perfectamente

Código PHP:

  
<a id="various3" href="http://localhost/dts/html/contacto.php" style="color: rgb(28, 91, 131); font-weight: bold; font-size: 13px;"><?php echo $txt[4] ?></a>  

Pero si intento realizar otra vez una llamada a la misma id, no funciona el efecto del query...

Código PHP:

  
<a id="various3" href="http://localhost/dts/html/contacto.php" style="color: rgb(28, 91, 131); font-weight: bold; font-size: 13px;"><?php echo $txt[4] ?></a>
 
<a id="various3" href="http://localhost/dts/html/contacto.php" style="color: rgb(28, 91, 131); font-weight: bold; font-size: 13px;"><?php echo $txt[4] ?></a>  

He probado de descargar el pack de nuevo, y al duplicar una llamada pasa exactamente lo mismo. ( http://fancybox.googlecode.com/files/jquery.fancybox-1.3.4.zip )

Alguna idea de lo que puede estar pasando?

Muchas gracias gente!

[SiKuSS]

Ya lo he arreglado gente, simplemente he tenido que repetir el mismo efecto, para otro tipo y funciona perfectamente!!!


Algo así

Código PHP:

              $("#various3").fancybox({
                'width'                : '40%',
                'height'            : '90%',
                'autoScale'            : true,
                'transitionIn'        : 'none',
                'transitionOut'        : 'none',
                'type'                : 'iframe'
            });
 
            $("#various4").fancybox({
                'width'                : '40%',
                'height'            : '90%',
                'autoScale'            : false,
                'transitionIn'        : 'none',
                'transitionOut'        : 'none',
                'type'                : 'iframe'
            }); 
   

Gracias de todas maneras, espero que les sirva un saludo!

[cmeraz]

te recomiendo que no utilices ID#, en ves de eso utiliza un .class, es natural que no te deje utilizar el mismo ID, pues en HTML los IDs son unicos, en cambio, puedes utilizar una misma clase para cualquier elementos, ejemplo:

Código HTML:

<a id="various1" class="effecto" href="http://localhost/dts/html/contacto.php" style="color: rgb(28, 91, 131); font-weight: bold; font-size: 13px;"><?php echo $txt[4] ?></a>
<a id="various2" class="effecto" href="http://localhost/dts/html/contacto.php" style="color: rgb(28, 91, 131); font-weight: bold; font-size: 13px;"><?php echo $txt[4] ?></a>
<a id="various3" class="effecto" href="http://localhost/dts/html/contacto.php" style="color: rgb(28, 91, 131); font-weight: bold; font-size: 13px;"><?php echo $txt[4] ?></a>
 

observa que la clase .fancybox, se repite constantemente para cualquier anchor tag y la #ID es diferente para cada uno.

el codigo jQuery quedaria de la siguiente manera:

Código Javascript:

$(".effecto").fancybox({
                'width'                : '40%',
                'height'            : '90%',
                'autoScale'            : true,
                'transitionIn'        : 'none',
                'transitionOut'        : 'none',
                'type'                : 'iframe'
            });
 

El selector de la clase se hace con un . en vez de un #
Espero te sirva y saludos!