jQuery 보이는 플러그인에 블리드 추가

Question

jQuery 보이는 플러그인을 사용하고 있습니다 : link here.

이전에 발견 할 수있는 "눈으로 보는"독서를 만들기 위해 노력하고 있다는 점을 제외하고는 효과가 있습니다. 현재 전체 요소가 창 안에 표시 될 때까지 "보이는"것으로 읽히지 않는 것처럼 보입니다. 플러그인에 설정할 피가있는 매개 변수가 표시되지 않습니다.

수동으로 도련을 설정하여 더 빨리 눈으로 확인할 수있는 방법이 있습니까?

$('.featured_work .item').each(function(){ 
    $(this).append('<span></span>'); 
    // Is this element visible onscreen? 
    var visible = $(this).visible(); 
    if (visible == true) { 
     $(this).find('.black_box').fadeIn(); 
    } 
}); 

Answer 1

저는 JQuery에 의존하지 않는 것이 좋습니다.이 기능은이 기능을 사용하지 않고 쉽게 계산할 수 있습니다.

var isVisible = function(element) { 
    var box = element.getBoundingClientRect(); 
    if (box.bottom > 0 && box.bottom < window.innerHeight) { 
     return true; 
    } else if (box.top > 0 && box.top < window.innerHeight) { 
     return true; 
    } 
    return false; 
}