Ivan Ivković Posted March 5, 2012 Share Posted March 5, 2012 <?php include('init.php'); include(INCLUDES . 'head.php'); echo '</head>'; echo '<body>'; ?> <script type="text/javascript" src="<?php echo SCRIPTS ?>masonry.min.js"></script> <script type="text/javascript"> window.onload = function() { var wall = new Masonry( document.getElementById('container') ); }; /* AJAX */ function ajaxRequest(v1, v2){ if (v1 == ""){ document.getElementById("container").innerHTML = ""; return; } if(window.XMLHttpRequest){ xmlhttp = new XMLHttpRequest(); }else{ xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange = function(){ if (xmlhttp.readyState == 4 && xmlhttp.status == 200){ document.getElementById("container").innerHTML = xmlhttp.responseText; } } xmlhttp.open("GET", "<?php echo AJAX?>ajaxresponse.php?v1=" + v1 + '&v2=' + v2, true); xmlhttp.send(); } </script> <?php include(WIDGETS . 'navigation.php'); $result = $db -> query('SELECT id, img, usr, name, cityName, regionID, countryID FROM sc_pin JOIN loc_cities ON loc_cities.cityID = sc_pin.city ORDER BY time LIMIT 2'); if($result -> num_rows){ echo '<div id="container">'; while($fetch = $result -> fetch_array()){ $user = new User($fetch['usr']); if($fetch['regionID'] == NULL){ $result2 = $db -> query('SELECT countryName FROM loc_countries WHERE countryID = "' . $fetch['countryID'] . '"'); if($result2 -> num_rows){ $fetch2 = $result2 -> fetch_array(); $source = $fetch2['countryName']; }else{ $source = 'Source Not Found'; } }else{ $result2 = $db -> query('SELECT regionName FROM loc_regions WHERE regionID = "' . $fetch['regionID'] . '"'); if($result2 -> num_rows){ $fetch2 = $result2 -> fetch_array(); $source = $fetch2['regionName']; }else{ $source = 'Source Not Found'; } } echo '<div class=\'item\'>'; ?> <div onmouseover="document.getElementById('fb_like<?php echo $fetch['id']?>').style.display='block'" class="fb-like" id="fb_like<?php echo $fetch['id']?>" data-send="false" data-layout="button_count" data-width="450" data-show-faces="true"></div><div id="fb-root"></div> <script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=239687926121487"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk'));</script> <img class="pin" onmouseover="document.getElementById('fb_like<?php echo $fetch['id']?>').style.display='block'" onmouseout="document.getElementById('fb_like<?php echo $fetch['id']?>').style.display='none'" <?php echo ' src=\'pins/' . $fetch['usr'] . '/' . $fetch['img'] . '\'/><div style="width: 100%;"><img src="' . $user -> small_picture_url . '" class="prof"/> <span class="act"> has been to "' . $fetch['name'] . '"</span></div><span class=\'loc\'> ' .$fetch['cityName'] . ', '. $source . '</span></br></div>'; } echo '</div>';// }else{ echo '<div id="error_content">Error or empty database. Please contact the staff immediately.</div>'; } ?> <script type="text/javascript"> </script> I want my code to call ajaxrequest to fill container div with more data when user scrolls the page down. Soz if the HTML part is bit messy, I have to shrink it. Quote Link to comment https://forums.phpfreaks.com/topic/258303-onscroll-load-more-items/ Share on other sites More sharing options...
Ivan Ivković Posted March 5, 2012 Author Share Posted March 5, 2012 Solved with bodyonscroll="ajaxfunction bla bla". I must improve it to be more specific, not to be reactive to any scroll. Quote Link to comment https://forums.phpfreaks.com/topic/258303-onscroll-load-more-items/#findComment-1324080 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.