I will show an implementation where the connection nay is via PDO
, but it’s about answering your question that’s not about secure connection:
TEST
Create a table in the database called post
CREATE TABLE post(
mes_id INT PRIMARY KEY AUTO_INCREMENT,
msg TEXT);
When there is scrolling down, the script ($(window).scroll)
thinks you’re at the bottom and calls the ultimo_post_funtion()
. Take a look at $.post("")
, for example: $.post("load_data.php? action=get&ultimo_post_id=35")
load_data.php
<?php
include('config.php');
$ultimo_post_id=$_GET['ultimo_post_id'];
$action=$_GET['action'];
if($action <> "get")
{
?>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
function ultimo_post_funtion()
{
var ID=$(".message_box:last").attr("id");
$('div#ultimo_post_loader').html('<img src="bigLoader.gif">');
$.post("load_data.php?action=get&ultimo_post_id="+ID,
function(data){
if (data != "") {
$(".message_box:last").after(data);
}
$('div#ultimo_post_loader').empty();
});
};
$(window).scroll(function(){
if ($(window).scrollTop() == $(document).height() - $(window).height()){
ultimo_post_funtion();
}
});
});
</script>
</head>
<body>
<?php
include('load_1.php'); //Include load_1.php
?>
<div id="ultimo_post_loader"></div>
</body>
</html>
<?php
}
else
{
include('load_2.php'); //include load_2.php
}
?>
load_1.php
<?php
$sql=mysql_query("SELECT * FROM post ORDER BY mes_id DESC LIMIT 4");
while($row=mysql_fetch_array($sql))
{
$msgID= $row['mes_id'];
$msg= $row['msg'];
?>
<div id="<?php echo $msgID; ?>" class="message_box" >
<?php echo $msg; ?>
</div>
<?php
}
?>
load_2.php
<?php
$ultimo_post_id=$_GET['ultimo_post_id'];
//mostrando 4 post
$sql=mysql_query("SELECT * FROM post WHERE mes_id < '$ultimo_post_id' ORDER BY mes_id DESC LIMIT 4");
$ultimo_post_id="";
while($row=mysql_fetch_array($sql))
{
$msgID= $row['mes_id'];
$msg= $row['msg'];
?>
<div id="<?php echo $msgID; ?>" class="message_box" >
<?php echo $msg;
?>
</div>
<?php
}
?>
CSS
body
{
font-family:'Georgia',Times New Roman, Times, serif;
font-size:18px;
}
.message_box
{
height:60px;
width:600px;
border:dashed 1px #48B1D9;
padding:5px ;
}
#last_msg_loader
{
text-align: right;
width: 920px;
margin: -125px auto 0 auto;
}
.number
{
float:right;
background-color:#48B1D9;
color:#000;
font-weight:bold;
}
Source
How the scroll is infinite if there is a message that identifies the limit?
– Lollipop
You want the posts to appear according to the scroll scroll and when all are presented, the message appears?
– Lollipop
1 - infinite scroll not to the letter, hehe. 2 - Yes, @Lollipop.
– Igor
That answer can help. Adjusting to your case, just start with an event that loads with
PG=1
.– Papa Charlie
I’ve tried showing the last eight before the roll, but nothing happens. Follow the code: http://pastebin.com/gP5nVQyB however, when entering the page nothing happens, no message is loaded and does not return any error in the console.
– Igor