石積み効果のための同位体の使用
ページを読み込んで下にスクロールすると、アイテムを追加するために Twitter のビヘイビア メソッドを使用しているので、基本的にはクリックしてクリックしますが、これが初めてクリックされると、アイテムがページに「落ちて」しまい、その理由がわかりません。 - その後は受け入れられますが、最初のクリックはありません
これが私が使用している完全なコードです
$(document).ready(function () {
//$(function() {
var $container = $('#wall');
// isotope
$container.isotope({
itemSelector: '.wish_wrap_indiv',
animationEngine : "best-available",
getSortData: {
name: function($element) {
return $element.data('name');
},
site: function($element) {
return $element.data('site');
},
date_added: function($element) {
return $element.data('date_added');
}
}
});
// trigger Isotope layout again after images have loaded
$container.imagesLoaded( function() {
$container.isotope('reLayout');
});
// filter items when filter link is clicked
$('#options a').click(function(){
var selector = $(this).attr('data-filter');
$container.isotope({ filter: selector });
return false;
});
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');
});
// infinite scroll
$container.infinitescroll({
navSelector : "#page_nav",
// selector for the paged navigation (it will be hidden)
nextSelector : "#page_nav a",
// selector for the NEXT link (to page 2)
itemSelector : ".wish_wrap_indiv",
// selector for all items you'll retrieve
behavior: "twitter",
loading : {
'finishedMsg' : 'No more wishes to load.',
'img' : 'http://wishesandgifts.com/images_/icons/loading_sml.gif',
'selector' : '#wall'
}
},
// call Isotope as a callback
function(newElements) {
var $newElems = $(newElements);
$newElems.imagesLoaded(function(){
$container.isotope('insert', $newElems );
});
}
);
});
私$(document).ready(function () {も使用していますが、試してみました$(function () {
また、「追加」を使用して新しいアイテムを挿入しようとしましたが、結果は同じです。
何か案は？