同位素高度不随内容变化

Posted 2023-03-06

【中文标题】同位素高度不随内容变化

【英文标题】：Isotope Height doesnt change with content

【发布时间】：2013-03-28 04:08:36

【问题描述】：

我一直在研究同位素容器，但在获得高度以保持内容动态时遇到了一些麻烦。

我已经为我的容器添加了选项，例如 reLayout，可调整大小的 true 但似乎无法正常工作。

我注意到我的容器正在注入一个高度样式，但还没有弄清楚从哪里开始，你会在我的视频中注意到我能够获得适合我的内容的高度的唯一方法是设置一个高度同位素内的 div 之一（col_1），容器似乎将高度注入其中，但不会使用其他选项卡调整大小。昨天我整天都在摆弄 css 来尝试解决这个问题，但我被难住了。

这里有一个关于我的问题的 jing 视频： http://www.screencast.com/t/Zq1giEtdt

这是网站： http://daniloportal.com/NPC/howitworks.html

另外，这是我的同位素 js 的片段

//Isotope sorting
 var $container = $('.projects');

 $container.isotope(
    filter: '.sort_category1',
    resizesContainer: true,
    resizable: true,    
  );

  $('.projects').isotope('reLayout')

  var $optionSets = $('#options .option-set'),
      $optionLinks = $optionSets.find('a');

  $optionLinks.click(function()
    var $this = $(this);
    // don't proceed if already selected
    if ( $this.hasClass('selected') ) 
      return false;
    
    var $optionSet = $this.parents('.option-set');
    $optionSet.find('.selected').removeClass('selected');
    $this.addClass('selected');

    // make option object dynamically, i.e.  filter: '.my-filter-class' 
    var options = ,
        key = $optionSet.attr('data-option-key'),
        value = $this.attr('data-option-value');
    // parse 'false' as false boolean
    value = value === 'false' ? false : value;
    options[ key ] = value;
    if ( key === 'layoutMode' && typeof changeLayoutMode === 'function' ) 
      // changes in layout modes need extra logic
      changeLayoutMode( $this, options )
     else 
      // otherwise, apply new options
      $container.isotope(options);
    

    return false;
  );

);

感谢任何帮助，感谢互联网！

【参考方案1】：

经过一番困惑后，我想通了。我有太多为 Col_1 设置的高度样式，我所做的只是消除这些样式，同位素现在动态设置所有高度参数！ :D