私は同位体コンテナに取り組んできましたが、高さをコンテンツに合わせて動的に保つのに少し苦労しました。
reLayout
コンテナに, resizeable true のようなオプションを追加しましたが、機能していないようです。
コンテナに高さスタイルが注入されていることに気付きましたが、どこからかわかりませんでした。ビデオで、コンテンツに合わせて高さを取得できた唯一の方法は、同位体内のdiv ( col_1
) では、コンテナーはその高さを注入されているように見えますが、他のタブではサイズが変更されません。昨日、これを解決しようと昼夜を問わずCSSをいじりましたが、困惑しました。
私の問題のビデオをここに紹介します: 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;
});
});
どんな助けでも大歓迎です、interwebsに感謝します!