Si quieren activar Fancybox (o lightbox o cualquier otra cosa) para los enlaces que llevan a una imagen, debemos hacer lo siguiente:
Incluimos las librerías de jQuery y Fancybox:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script> <script type="text/javascript" src="js/fancybox.min.js"></script>
Usamos el pseudo selector a:has(img) para llamar a Fancybox:
<script type="text/javascript">
$(document).ready(function(){
$("a:has(img)").fancybox({
'transitionIn' : 'elastic',
'transitionOut' : 'elastic',
'overlayColor' : '#000',
'overlayOpacity' : '0.5',
'overlayShow' : 'true',
'titlePosition' : 'outside',
'titleForma' : function(title, currentArray, currentIndex, currentOpts) {
return '<span id="fancybox-title-over">Imagen ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' &amp;amp;nbsp; ' + title : '') + '</span>';
}
});
});
</script>
