3초기억력

safari ajax scroll Error 대처법 본문

코딩_jquery

safari ajax scroll Error 대처법

잠수콩 2015. 12. 8. 10:18
336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.




제목 : safari ajax scroll Error 대처법




소스 :



//더보기

var i = 2;

var tf = true;


function receiveMessage(){


$.ajax({

url : "/m/common/exec_getMainGoodsList.asp",

data : "page=" + i + "&cate=<%=cate%>&listtype=<%=listtype%>",

error : function(html, status){

//alert(html+'오류입니다.');

},

success : function(html, status){

i += 1;

if (html == 'no_data')

{

//alert('더이상 상품이 존재하지않습니다.');

} else {

var $items = $(html);


$items.imagesLoaded().then(function(){

$(".cont_list").append($items).masonry('appended',$items);

tf = true;

});


}

}

});


}



$(window).scroll(function(){

var pp = $(window).scrollTop();

var hh = $(window).height();

var bd = $(document).height();

if(tf)

{

if(pp + hh + 300 >= bd){

tf = false;

receiveMessage();

}

}

});




내용 :


화면이 바닥 300px 위가 보여질때, 자동 스크롤 되면서 ajax 내용을 뿌리도록 하는 스크립트이나,


IOS safari 에서는 제대로 작동이 안된다.


위로 스크롤할 때, 다른 브라우저들은 이상이 없으나, safari 는 up scroll 할 때, 계속 좌표를 계산한다.


PC, mobile 둘다 익스플로러, 크롬, 파이어폭스 등은 잘 된다.


PC safari 도 잘된다. 모바일이 문제.


그래서 tf 변수에 true, false 로 제어하니 제대로 된다.




예제 소스 파일 :


 출처 :  




Comments