2012-05-12 4 views
4

이 작업을 수행하지 못하면 복잡해질 수 있으므로 가능한 한 최선을 다해 상황을 설명하려고 노력합니다.jQuery 함수가 무한 스크롤 (AJAX) with Masonry

나는 벽돌과 함께이 jQuery 플러그인 http://www.infinite-scroll.com/을 사용하고 있습니다 : http://masonry.desandro.com/

모든 것이 잘 작동한다.

그러나 게시물 위로 마우스를 가져 가면 각 게시물과 관련된 정보를 표시하려고합니다.

$(".main").hover(function(){ 
    $(this).next(".info").slideToggle("fast"); 
}); 

이 첫 번째 페이지의 콘텐츠에 작품이 아니라 무한 스크롤에 의해로드 된 추가 내용 : 여기 내 코드입니다.

// trigger Masonry as a callback 
function(newElements) { 
    // hide new items while they are loading 
    var $newElems = $(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); 
    }); 
    $(".main").hover(function(){ 
     $(this).next(".info").slideToggle("fast"); 
    });  
}); 

(I이 완전히 잘못하고 있어요 경우 실례합니다, 나는 전에 아약스와 함께 일한 적이 있고 단순히 실험을하고있다)

:

그래서 난 내 벽돌 코드의 콜백 기능을 추가하는 시도

이렇게하면 Infinite 스크롤에 의해로드 된 새로운 추가 콘텐츠에서 호버 기능이 작동하지만 원본 콘텐츠와 충돌합니다.

그렇다면 호버 기능을 구현하여 Ajax 호출 전후에로드 된 모든 게시물에 대해 올바르게 작동하는 가장 좋은 방법은 무엇입니까?

감사합니다. 비슷한 문제가 발견으로

$(document).on("click",".main",function(){ 
    $(this).next(".info").slideToggle("fast"); 
}); 

http://api.jquery.com/on/

내가 누군가 넣다 여기에 원래의 질문을 떠날 것이다 :

이 내 방법을 변경하여 문제를 해결 : EDIT


유능한.

벽돌과 함께 http://www.infinite-scroll.com/의 최신 버전은
+2

질문을 표시하려면 해결, 당신은 귀하의 질문에 대답해야한다 , 승인 된 것으로 표시하십시오. 답을 질문으로 편집하지 마십시오. – Imp

+0

@Imp 그걸 시도했지만 그럴만한 명성이 없습니다. – Harry

+0

당신이 조금만 기다려야한다고 생각합니다 ... –

답변

0
$(document).on("click",".main",function(){ 
    $(this).next(".info").slideToggle("fast"); 
});