5

私は、Wordpressの無限のスクロールプラグインと石積みを使用しているテーマを統合することに厄介な問題に直面しています。woocommerceの石積みの無限スクロールが機能しない

私は、無限スクロールの最新バージョンを持っている2.6.2、と私はプラグインのコールバックセクションに次のコードを追加しました:

// hide new items while they are loading 
var $newElems = jQuery(newElements).css({ opacity: 0 }); 
// ensure that images load before adding to masonry layout 
$newElems.imagesLoaded(function(){ 
// show elems now they're ready 
$newElems.animate({ opacity: 1 }); 
    $container.masonry('appended', $newElems, true); 
}); 

が、それは働いていない、それは新しいに不透明度を追加要素を追加することはありません。新しい商品は古い商品のページ上に表示されます。

// Only fire masonry if the window is an appropriate size and images are loaded 
jQuery(function(){ 
    var $container = jQuery('ul.products'); 
    $container.imagesLoaded(function(){ 
     if (jQuery(window).width() > 767) { 
      $container.masonry({ 
       itemSelector : 'li.product', 
       columnWidth : 295, 
       isFitWidth: true, 
       gutterWidth : 2 
      }); 
     } 
    }); 
}); 

答えて

3

WordPress用の無限スクロールのプラグインを::石工がどのように見える

/* <![CDATA[/
var infinite_scroll = "{\"loading\":{\"msgText\":\"Loading...<\\/em>\",\"finishedMsg\":\"No additional products.<\\/em>\",\"img\":\"http:\\/\\/www.test.com\\\/wp-content\\\/plugins\\\/infinite-scroll\\\/img\\\/ajax-loader.gif\"},\"nextSelector\":\".next\",\"navSelector\":\".woo-pagination\",\"itemSelector\":\"li.product\",\"contentSelector\":\"ul.products\",\"debug\":false,\"behavior\":\"\",\"callback\":\"\\\/\\\/ hide new items while they are loading\r\nvar $newElems = jQuery(newElements).css({ opacity: 0 });\r\n\\/\\/ ensure that images load before adding to masonry layout\r\n$newElems.imagesLoaded(function(){\r\n\\/\\/ show elems now they're ready\r\n$newElems.animate({ opacity: 1 });\r\n$container.masonry('appended', $newElems, true);\r\n});\"}"; 
/]]> */ 

スクリプトのように見えるHere's the link、あなたが石積みのを選択することができますbehaviorという名前のオプションを持っています、そしてもちろんあなたはアクセスできるより多くのdevオプションを見るために、魅力のように動作するセレクタを選択する必要があります。the developers website

関連する問題