Fancybox no funciona/ejecuta

Iniciado por rubetron, 12 Mayo 2014, 13:38 PM

0 Miembros y 1 Visitante están viendo este tema.

rubetron

Buenas compañeros:
Llevo un par de dias revisando el codigo de la pagina web a la que estoy al cargo (no esta subida, solo la tengo de forma local)
Me mandaron desvincular esta pagina web www.aczafra.es de Joomla por la carga que producia en el servidor, y va perfecto.
El problema vino cuando hice la sección de galeria:
Me muestra las imagenes y todo eso pero no quiero que al clickear en la imagen te lleve a la ruta absoluta de la imagen. Para esto instale fancybox, de forma que si clickeaba se agrandaba la imagen sin perder de vista la pagina web.
Siguiendo las instrucciones de la pagina oficial y de otras paginas "instale" el plugin pero no funcionaba, clickeabas en la imagen y directamente te llevaba a la ruta absoluta.
Probe en una pagina web nueva y funciona asi que empece a dudar de que fuera la ruta de las librerias y heche un vistazo al codigo: Corregi ciertos fallos de estructura pero aun asi tampoco funcionaba, asi que pense que seria problema de la programacion (No programo de forma secuencial sino orientado a objetos).
Os pongo el codigo a ver si se os ocurre algo:

·Este es el archivo en el que tengo incluidas todas las librerias (la ruta esta mas que comprobada y esta bien, aunque puede que BASE_URL haga conflicto o algo)
(URL_BASE es un objeto que apunta al directorio raiz)

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="shortcut icon" href="<?=URL_BASE?>templates/aczafra/images/aczafra.ico">
<script type="text/javascript" src="<?=URL_BASE?>/lib/js/jquery-1.10.1.min.js"></script>
<script type="text/javascript" src="<?=URL_BASE?>/lib/js/slider.js"></script>
<script type="text/javascript" src="<?=URL_BASE?>/lib/js/slider2.js"></script>
<link rel="stylesheet" href="<?=URL_BASE?>templates/system/css/system.css" type="text/css" />
<link rel="stylesheet" href="<?=URL_BASE?>templates/system/css/general.css" type="text/css" />
<link rel="stylesheet" href="<?=URL_BASE?>templates/aczafra/css/default.css" type="text/css" />
<script type="text/javascript" src="<?=URL_BASE?>/lib/js/source/jquery.fancybox.js?v=2.1.5"></script>
<script type="text/javascript" src="<?=URL_BASE?>/lib/js/jquery.mousewheel-3.0.6.pack.js"></script>
<link rel="stylesheet" type="text/css" href="<?=URL_BASE?>/lib/js/jquery.fancybox.css?v=2.1.5" media="screen" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>


·Y aqui parte del codigo de la pagina

                    ·
                    ·
                    ·
<script type="text/javascript">
$(document).ready(function() {

$('.fancybox').fancybox();
}
</script>
   <style type="text/css">
.fancybox-custom .fancybox-skin {
box-shadow: 0 0 50px #222;
}

   </style>

                    ·
                    ·
                    ·
                      // Extraer imagenes y mostrarlas
$sql = "SELECT * FROM galeryimages WHERE id_galerycategories = :id";
$campos = array('id');
$valores = array($_GET['id']);
$album->setQuery($sql, $campos, $valores, NULL);
if($album->getQuery()->rowCount() == 0)
{
echo '<p>&nbsp;</p><p align="center">No hay albums creados por el momento.</p><p>&nbsp;</p>';
}
else{


while($a = $album->getQuery()->fetchObject())
{
// Comprobamos imagen
$srcImage = 'lib/php/phpthumb/phpThumb.php?src=../../../images/no-image.png&w=150&h=85&zc=1';
$srcImageBig = URL_BASE.'images/no-image.gif';
if($a->file != '' && file_exists('uploads/galery/images/'.$a->file))
{
$srcImage = URL_BASE.'uploads/galery/images/'.$a->file;
$srcImageBig = URL_BASE.'uploads/galery/images/'.$a->file;
}
echo '<div class="album2">
   <a class="fancybox" href="'.$srcImageBig.'">
<img src="'.$srcImage.'" border="0" width="150" height="85"/></a>
 </div>';                  
}



Siento que sea todo tan enrevesado y creo que he puesto el codigo que deberia mostrar las imagenes y aumentarlas con el fancybox.

La pagina en si funciona de maravilla con el problema del fancybox que no llega a iniciarse

PD: Los 3 puntos en el codigo significan que hay codigo entre medio pero por ciertas razones obvias no lo puedo poner aqui (Son muchas lineas de codigo  :xD )
echo "hola mundo";

rubetron

Llevo una racha de contestarme a mi mismo tremenda  :xD
El problema residia (Y esto nunca me ha pasado) en el orden de las librerias, parece que el Jcycle(slider y slider2) entra en conflicto y hay que cargarlo primero.
Esta mañana estaba saturadisimo con este error y he empece a borrar partes de la pagina hasta terminar en las librerias.

Al final las librerias han quedado asi :

script type="text/javascript" src="<?=URL_BASE?>/lib/js/slider.js"></script>
<script type="text/javascript" src="<?=URL_BASE?>/lib/js/slider2.js"></script>
        <!-- Add jQuery library -->
<script type="text/javascript" src="<?=URL_BASE?>lib/jquery-1.10.1.min.js"></script>
<!-- Add mousewheel plugin (this is optional) -->
<script type="text/javascript" src="<?=URL_BASE?>lib/jquery.mousewheel-3.0.6.pack.js"></script>

<!-- Add fancyBox main JS and CSS files -->
<script type="text/javascript" src="<?=URL_BASE?>source/jquery.fancybox.js?v=2.1.5"></script>
<link rel="stylesheet" type="text/css" href="<?=URL_BASE?>source/jquery.fancybox.css?v=2.1.5" media="screen" />

<!-- Add Button helper (this is optional) -->
<link rel="stylesheet" type="text/css" href="<?=URL_BASE?>source/helpers/jquery.fancybox-buttons.css?v=1.0.5" />
<script type="text/javascript" src="<?=URL_BASE?>source/helpers/jquery.fancybox-buttons.js?v=1.0.5"></script>

<!-- Add Thumbnail helper (this is optional) -->
<link rel="stylesheet" type="text/css" href="<?=URL_BASE?>source/helpers/jquery.fancybox-thumbs.css?v=1.0.7" />
<script type="text/javascript" src="<?=URL_BASE?>source/helpers/jquery.fancybox-thumbs.js?v=1.0.7"></script>

<!-- Add Media helper (this is optional) -->
<script type="text/javascript" src="<?=URL_BASE?>source/helpers/jquery.fancybox-media.js?v=1.0.6"></script>
        <link rel="stylesheet" href="<?=URL_BASE?>templates/system/css/system.css" type="text/css" />
<link rel="stylesheet" href="<?=URL_BASE?>templates/system/css/general.css" type="text/css" />
<link rel="stylesheet" href="<?=URL_BASE?>templates/aczafra/css/default.css" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="shortcut icon" href="<?=URL_BASE?>templates/aczafra/images/aczafra.ico">

echo "hola mundo";