事件不会在初始加载时触发
这是关于更改媒体屏幕使div叠加的另一个问题的延续
此问题与Isotope有关 。 在@Robin Carlo Catacutan的帮助下,我有以下isotope.js :
jQuery(function($) { var $container = $('#isotope-list'); //The ID for the list with all the blog posts $container.isotope({ //Isotope options, 'item' matches the class in the PHP itemSelector: '.item', layoutMode: 'masonry' }); // Add class when transition is finished $container.on( 'arrangeComplete', function( event, filteredItems ) { $(".grid figure img").addClass("imgArranged"); }); $container.on( 'arrangeComplete', function( event, filteredItems ) { console.log( 'Isotope arrange completed on ' + filteredItems.length + ' items' ); } ); //Add the class selected to the item that is clicked, and remove from the others var $optionSets = $('#filters,#filters-undercat'), $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('#filters'); $optionSets.find('.selected').removeClass('selected'); $this.addClass('selected'); //When an item is clicked, sort the items. var selector = $(this).attr('data-filter'); $container.isotope({ filter: selector }); return false; }); });
我希望你专注于转换结束时应该添加类的部分:
$container.on( 'arrangeComplete', function( event, filteredItems ) { $(".grid figure img").addClass("imgArranged"); });
根据@Robin Carlo Catacutan的说法,arrangeComplete存在问题。 事件arrangeComplete不会在页面的初始加载时触发。
同位素正在函数的开头加载.php:
//Isotope function add_isotope() { wp_register_script( 'isotope', get_template_directory_uri().'/js/isotope.pkgd.min.js', array('jquery'), true ); wp_register_script( 'isotope-init', get_template_directory_uri().'/js/isotope.js', array('jquery', 'isotope'), true ); wp_enqueue_script('isotope-init'); } add_action( 'wp_enqueue_scripts', 'add_isotope' );
我发布了最新post中的所有php,以防您发现任何可疑内容:
(array( 'foto', 'video', 'web' )), 'posts_per_page' => '-1', 'post_taxonomy' => 'any', ); $the_query = new WP_Query($args); ?> have_posts() ) : ?> have_posts() ) : $the_query->the_post(); $termsArray = get_the_terms( $post->ID, "category"); $termsString = ""; foreach ( $termsArray as $term ) { $termsString .= $term->slug.' '; } ?> <div class=" item col-md-4">