0

I'm using a script to load another page with a post value in it to update a SQL query. It works in safari but doesn't work in IE8. I don't know how to fix it. As you can see the page is all blank but does contain the element. So I'm assuming that there is something wrong with the .load function.

link: http://tamara.gwst.nl/infiniteScroll/index.php

index.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Web Gallery | Infinite Scroll</title>
<link rel="stylesheet" href="style.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script type="text/javascript" src="js/main.js"></script>
<script type="text/javascript" src="js/jquery.infinitescroll.js"></script>
</head>
<body>

<?php include('includes/connect.php'); ?>   

<div id="content"></div>
</body>
</html>

main.js

$("document").ready(function(){

    $("#content").load("scroll.php", {limit: 5});

    var counter = 5;

    $(window).scroll(function(){

        if($(window).scrollTop() + 1 > $(document).height() - $(window).height() ){     

                counter = counter + 5;

                $("#content").load("scroll.php", {limit: counter});


        }
    });

});

scroll.php

<? $limit = $_POST['limit']; ?>

<? 
include('includes/connect.php');
$sql = "SELECT name FROM scroll_images LIMIT $limit";
echo "</div>";

$result = mysql_query($sql);

while($row = mysql_fetch_array($result)){
    echo "<div class='post'><img src='img/".$row['name']. ".jpg' /></div>";
}

?>
Tamara
  • 145
  • 1
  • 4
  • 14

2 Answers2

1

Not sure if it's the cause of your bug but

$("document").ready(function(){ ... }

should be

$(document).ready(function(){ ... }

You want the JS variable document not the string "document".

IMSoP
  • 89,526
  • 13
  • 117
  • 169
  • Hmm, that isn't the solution..unfortunately. I tested it with a simulator in other versions. But it doesn't seem to work in IE at all. – Tamara Sep 24 '12 at 14:07
  • @user1648471: Simulator? What simulator? The only true test is within the actual browser version itself. MS provides Virtual PC and hard drive images with each browser version for free download. And IMSoP is 100% correct, you must not put `""` around `document` within the `document.ready`. – Sparky Sep 24 '12 at 14:32
  • I already removed that from my code. Also tested it in the real browser version (IE8) – Tamara Sep 24 '12 at 14:39
0

This might be a caching problem.

Try ,

$("#content").load("scroll.php?" +Math.random()*99999, {limit: counter});
Rahul
  • 1,549
  • 3
  • 17
  • 35
  • http://stackoverflow.com/questions/1061525/jquerys-load-not-working-in-ie-but-fine-in-firefox-chrome-and-safari – Rahul Sep 24 '12 at 14:10
  • $("#content").load("scroll.php", {'limit': 5}); try this – Rahul Sep 24 '12 at 14:43
  • 2
    @user1648471 @RahulMore Don't you need a '?' in there? `"scroll.php?" + Math.random()*99999` Otherwise you've got a non-existent URL like "scroll.php12345". – IMSoP Sep 24 '12 at 18:24