0

我正在使用 LightGallery 来展示我的作品集，并使用同位素来过滤类别。由于我的图像质量很高，我正在尝试使用ImageLoaded 但无法实现，仍在学习 jQuery。我希望 ImageLoaded 在显示预加载器（css​​ 或 gif）时在背景中加载图像，并且在加载完成后可以像放大一样进入图像。我的密码笔

    $(document).ready(function() {
        var $gallery = $('#gallery');
        var $boxes = $('.revGallery-anchor');
        $boxes.hide(); 

        $gallery.imagesLoaded( function() {
        $boxes.fadeIn();

            $gallery.isotope({
                // options
                sortBy : 'original-order',
                layoutMode: 'fitRows',
                itemSelector: '.revGallery-anchor',
                stagger: 30,
                masonry: {
                  columnWidth: 200
                }
            });
        }); 

        $('button').on( 'click', function() {
            var filterValue = $(this).attr('data-filter');
            $('#gallery').isotope({ filter: filterValue });
            $gallery.data('lightGallery').destroy(true);
            $gallery.lightGallery({
                selector: filterValue.replace('*','')
            });
        });
  });

这是我正在尝试使用的代码。它尚未完成，但我被卡住了，不知道下一步。它也没有动画。

请帮忙，谢谢。

4

1 回答 1

0

$.lightGallery()你丢失了所以添加的初始化。添加了一个预加载器，我在同位素运行后淡出。当同位素完成加载时，我也会隐藏#gallery并opacity: 0;淡化它。写一些可以“放大”你的图像的东西会有点棘手，所以我会把它留给你。http://codepen.io/anon/pen/pRwEXg

于 2017-01-23T17:43:58.497 回答