Os links do Fancybox não aparecem na checkbox de luz – o que está faltando?

Tudo bem, eu pensei que eu implementei isso corretamente, mas acho que devo ter brincado em algum lugar.

Aqui está meu código:

Jquery aqui:

jQuery(document).ready(function( $ ){ $(function() { $( ".cta-nav-hover" ).tooltip({ show: null, position: { my: "right+40 bottom", at: "left bottom" }, open: function( event, ui ) { ui.tooltip.animate({ top: ui.tooltip.position().top - 10 }, 75 ); } }); }); $(function() { $(".fancybox").fancybox(); }); }); 

Então o HTML:

 

Eu pensei que isso funcionaria, mas quando eu clico no link, ele só me leva à imagem do espaço reservado em vez de fazer um pop-up. O que eu fiz errado? Parece que eu tenho os arquivos alinhados corretamente, ou pelo menos quando eu os inspeciono através do firebug ele vai para o js adequado.

Aqui está o que eu chamei na cabeça:

              

Eu também tentei outro plugin chamado Magnific Popup, mas também não responde. Eu estou pensando que tem algo a ver com a configuração do meu wordpress.

Este href="http://placehold.it/350x125" não diz ao fancybox que você está abrindo uma image para que você:

1). adicione a class especial fancybox.image ao seu link como

  

2). adicione o atributo (HTML5) data-fancybox-type ao seu link como

  

3). adicionar a opção de type ao seu script de fantasia como

 $(".fancybox").fancybox({ type: "image" }); 

o que você acha que funciona melhor para o seu caso.

NOTA : números 1). e 2). acima do trabalho apenas para o fancybox v2.x. Número 3). funciona para v1.3.4 e v2.x

EDIT : incluiu um JSFIDDLE com seu código e jQuery v1.8.3.

Existem dois links:

  • um usando a class “fancybox.image”: trabalhando
  • outro sem: não funciona