2013-04-25 52 views
0

我在這裏使用的代碼創建一個合理的空間:http://jsfiddle.net/thirtydot/EDp8R/3/jQuery的重新開始CSS:DIV上後後jQuery函數結束

我也用infinitescroll裝載更多的物品。

當前JS:

$("#posts").infinitescroll({ 
navSelector : '#page_nav', // selector for the paged navigation 
nextSelector : '#page_nav a', // selector for the NEXT link (to page 2) 
itemSelector : '.item',  // selector for all items you'll retrieve 
loading: { 
    finishedMsg: 'No more pages to load.', 
    img: 'http://i.imgur.com/qkKy8.gif' 
    } 
}, 

function(newElements) { 
      $(newElements).each(function() { 
       $(this).css("width", $(this).width()); 
      }); 
      $('#posts').removeClass('posts').addClass('posts'); 
} 
);  

CSS:

#posts.posts{ 
    text-align: justify; 
    -ms-text-justify: distribute-all-lines; 
    text-justify: distribute-all-lines; 
} 

#posts.posts .post{ 
    height: 250px; 
    vertical-align: top; 
    display: inline-block; 
    *display: inline; 
    zoom: 1 
} 

#posts.posts:after { 
    content: ''; 
    width: 100%; 
    display: inline-block; 
    font-size: 0; 
    line-height: 0 
} 

此代碼加載的項目的拳頭塊,但忽略加載無限滾動

項目已經嘗試過這個(作爲另一個類似帖子中的答案發現):

$("head").append($('<style>div#posts:after { content: "";width:100%;display:inline-block;font-size:0;line-height:0; }</style>')); 

回答

0

我找到了答案 每個新的元素應該有一個空間添加 只是$(this).before("&nbsp;");

添加新內容是:

$("#posts").infinitescroll({ 
navSelector : '#page_nav', // selector for the paged navigation 
nextSelector : '#page_nav a', // selector for the NEXT link (to page 2) 
itemSelector : '.item',  // selector for all items you'll retrieve 
loading: { 
    finishedMsg: 'No more pages to load.', 
    img: 'http://i.imgur.com/qkKy8.gif' 
    } 
}, 

function(newElements) { 
      $(newElements).each(function() { 
       $(this).before("&nbsp;"); 
       $(this).css("width", $(this).width()); 
      }); 
      $('#posts').removeClass('posts').addClass('posts'); 
} 
); 
相關問題