0

这是一个相当复杂的修改。我有一个使用同位素设置的网格系统。客户希望每次用户访问该页面时此网格都是随机的。这很容易通过添加 sortBy: 'random' 来使用同位素进行设置。

但是，同位素中的第一项具有“特征”类。这个特色类激活了更宽的网格元素和一些信息供用户单击，因此这将始终是我网格中的第一项。

现在，我需要做的是每次将随机序列中的第一个元素设置为“特色”。所以每次用户访问页面时，特色网格项都会有所不同。目前，因为我已经对特色类进行了硬编码，所以它只是随机放置在网格中。

反正有没有给随机序列中的第一个元素一个类？这是我的代码：

<script>
           var $container = $('#home-grid');

            $container.isotope({
              // options...
              resizable: true, // disable normal resizing
              sortBy : 'random',
              // set columnWidth to a percentage of container width
              masonry: { columnWidth: $container.width() / 2 }
            });

            $(window).smartresize(function(){
              $container.isotope({
                // update columnWidth to a percentage of container width
                masonry: { columnWidth: $container.width() / 2 }
              });
            });
        </script>
4

1 回答 1

0

有一种方法可以给随机序列中的第一个同位素元素一个类别！

使用回调函数并在该回调函数中，通过查找每个 Isotope 元素的某些值来找出哪个元素被定位为第一个元素：

  1. transform每个元素的矩阵值：tx和ty
  2. $container填充值：padding-top和padding-left

获得这 4 个值后，检查 的值是否tx与 匹配，padding-left以及 的值是否ty与 匹配padding-top。

如果两个条件都为真/匹配，请分配您的自定义类，例如。.featured到那个元素。

于 2013-03-13T08:39:14.777 回答