Question

我的目标是将setupSorting函数放在ImageLoad函数中。它们在分离时工作（here），但在组合时排序失败（here）。

此：

      $(document).ready (function(){
            /* reshuffle when user clicks a filter item */
            $('.filter-tags a').click(function (e) {
                e.preventDefault();

                // set active class
                $('.filter-tags a').removeClass('active');
                $(this).addClass('active');

                // get group name from clicked item
                var groupName = $(this).attr('data-group');

                // reshuffle grid
                $grid.shuffle('shuffle', groupName );
            });

需要进入这个：

var ImageLoad = (function( $, imagesLoaded ) {

  var $shuffle = $('.masonry-gallery'),
      $imgs = $shuffle.find('img'),
      $loader = $('#loader'),
      sizer = document.getElementById('#shuffle-sizer'),
      imgLoad,

  init = function() {

    // Create a new imagesLoaded instance
    imgLoad = new imagesLoaded( $imgs.get() );

    // Listen for when all images are done
    // will be executed even if some images fail
    imgLoad.on( 'always', onAllImagesFinished );
  },

  onAllImagesFinished = function( instance ) {

    if ( window.console && window.console.log ) {
      console.log( instance );
    }

    // Hide loader
    $loader.addClass('hidden');

    // Adds visibility: visible;
    $shuffle.addClass('images-loaded');

    // Initialize shuffle
    $shuffle.shuffle({
      sizer: sizer,
      itemSelector: '.gallery-photo'
    });
  };

  return {
    init: init
  };
}( jQuery, window.imagesLoaded ));

$(document).ready(function() {
  ImageLoad.init();
});

最终目标是像这个页面一样，只有排序：http://vestride.github.io/Shuffle/images/

Answer 1

经过几个小时的实验，我终于明白了。你是对的，我没有打电话给你。我也忘了在合并后将all(imag(V(end,:))==0)更改为$grid.shuffle。

仍然没有做到这一点，所以我更改了$shuffle.shuffle函数（以及随后的某些html）以更接近地匹配作者（here）

生成的代码有效！

setupSorting

你可以看到完整的小提琴（here）。

结合jQuery代码 - ImagesLoaded + Shuffle.js

1 个答案: