2016-07-18 8 views
0
<head> 
<script> 
function yHandler(){ 



    // Watch video for line by line explanation of the code 
    // http://www.youtube.com/watch?v=eziREnZPml4 
    var wrap = document.getElementById('wrap'); 
    var contentHeight = wrap.offsetHeight; 
    var yOffset = window.pageYOffset; 
    var y = yOffset + window.innerHeight; 
    var flag=0; 

    if(y >= contentHeight){ 
     $(function() { 
      var count=0; 

    $.ajax({ 

     type: "GET", 
     dataType: "jsonp", 
     cache: false, 
     url:myurl, 
     success: function(data) { 

      //var nexturl=data.pagination.next_url; 
      //alert(data.pagination.next_url); 
       for (var i = 0; i <5; i++) { 
       wrap.innerHTML += '<div class="newData"><img src="'+data.data[i].images.low_resolution.url+'"/></div>'; 
       count++; 
       //if(data.pagination.next_url="") flag++; 
      // alert(count); 
       if(count>4){ 
      myurl=data.pagination.next_url; 
       //alert(myurl); 

       count=0;  
       } 
       // alert(data.data[i].images.low_resolution.url); 
      } 
     } 
    }); 
}); 
    } 
    var status = document.getElementById('status'); 
    status.innerHTML = contentHeight+" | "+y; 
} 
var myurl="https://api.instagram.comxxxxxxxxxx"; 
window.onscroll = yHandler; 
</script> 
</script> 
<style type="text/css"> 
div#status{position:fixed; font-size:24px;} 
div#wrap{width:800px; margin:0px auto;} 
div.newData{height:1000px; background:#09F; margin:10px 0px;} 
</style> 
</head> 
<body> 
<div id="status">0 | 0</div> 
<div id="wrap"><img src="abc.jpg" height="1000" /></div> 
<div id="pics"></div> 
</body> 

このコードはgoogle chromeで完全に機能し、ユーザーがページの一番下をクリックすると新しい画像が読み込まれます。しかし問題は、たとえユーザーがページの一番下にいなくても、それがyhandlerを呼び出すので、Firefoxで動作していないということです。何か案は。カスタムスクロールエフェクトはSafariとFirefixでは機能しませんが、クロムで完璧に動作していますか?

答えて

1

jQueryを使用してマウスイベントをバインドできます。

// Firefoxの

$("body").bind('DOMMouseScroll', function(e){ 
    if(e.originalEvent.detail){ 
     yHandler(); 
    } 
}); 

// IE、オペラ、サファリ

$("body").bind('mousewheel', function(e){ 
    if(e.originalEvent.wheelDelta){ 
     yHandler(); 
    } 
}); 
+0

あなたは正確に私はこのコードを置くべきラインで私を伝えることができますか? –

+0

"window.onscroll = yHandler;"の代わりに、上記を使用する必要があります。また、$(function(){// bind code here})の中にインクルードしてください。 – Pandiarajan

+0

これは役に立ちましたか? – Pandiarajan

関連する問題