0

I have a problem with loading other items (with mysqli / ajax), works perfectly on the desktop PC but does not work on the mobile and laptop..

(Sorry for my English)

Script in index

$(document).ready(function() {
  var min = 5;
  $(window).scroll(function() {
    if ($(window).scrollTop() == $(document).height() - $(window).height()) {
      $.ajax({
        type: "post",
        url: "get_more.php",
        data: {
          username: document.getElementById("user").value,
          min: min
        },
        cache: false,
        success: function(data) {
          min += 3;
          $("#postList").append(data);

          if (data == "") {
            $("#load_data_message").html(
              "<p class='text-center'>No More Data Found | End of List</p>"
            );
            action = "active";
          }
        }
      });
      return false;
    }
  });
});

Thanks in advance, if you need anything else let me know

EDIT 1: I tried this but it doesn't work the same:

document.addEventListener("touchmove", ScrollStart, false); 
document.addEventListener("scroll", Scroll, false); function ScrollStart() { 
} 
function Scroll() { 
if((window.pageYOffset == $(document).height() - $(window).height())) { 
alert("test"); 

} 

}
Dr0p3r
  • 1
  • 2

1 Answers1

0

Ultimately the issue lies with scroll event behaving differently on mobile, plus you should rely on pageYOffset and not scrollTop. Look here:

javascript scroll event for iPhone/iPad?

Misha Reyzlin
  • 13,736
  • 4
  • 54
  • 63