点击它们后,缩略图消失,FancyBox

Edg*_*ars 0 javascript jquery fancybox

我创建了FancyBox画廊.但现在,当我点击缩略图时,它会按计划显示图像galery.但在背景中我可以看到所有缩略图一个接一个地消失.在F5或页面重新加载后,所有缩略图都返回.

我的代码:

    <a class="fancybox" data-fancybox-group="gallery" title=""> <%=  image_tag('s_1.jpg') %></a>
    <a class="fancybox"  data-fancybox-group="gallery" title=""><%= image_tag('s_2.jpg') %></a>
    <a class="fancybox" data-fancybox-group="gallery" title=""><%= image_tag('s_3.jpg') %></a>
   <a class="fancybox"  data-fancybox-group="gallery" title=""> <%= image_tag('s_4.jpg') %></a>
   <a class="fancybox" data-fancybox-group="gallery"  title=""> <%= image_tag('s_5.jpg') %></a>
Run Code Online (Sandbox Code Playgroud)

应用程序 .js

$(document).ready(function() {
    $(".fancybox").fancybox();
});
Run Code Online (Sandbox Code Playgroud)

你可以在这里看到的例子

小智 5

您需要在<a>-tag中定义图像源.即使您没有缩略图和图库视图的不同大小的图像,您仍然需要定义两次,如下所示:

<a class="fancybox" href="image_source" data-fancybox-group="gallery" title=""><img src="image_source" alt="" /></a>
Run Code Online (Sandbox Code Playgroud)

  • +1:否则 fancybox 会将缩略图视为内联内容,并在关闭后将其重新隐藏 (2认同)