javascript load more on scroll to bottom of div code example

Example 1: ajax call to load a page on scrolling

<?php

// configuration
include 'config.php';

$row = $_POST['row'];
$rowperpage = 3;

// selecting posts
$query = 'SELECT * FROM posts limit '.$row.','.$rowperpage;

$result = mysqli_query($con,$query);

$html = '';

while($row = mysqli_fetch_array($result)){
  $id = $row['id'];
  $title = $row['title'];
  $content = $row['description'];
  $shortcontent = substr($content, 0, 160)."...";
  $link = $row['link'];
  // Creating HTML structure
  $html .= '<div id="post_'.$id.'" class="post">';
  $html .= '<h1>'.$title.'</h1>';
  $html .= '<p>'.$shortcontent.'</p>';
  $html .= '<a href="'.$link.'" target="_blank" class="more">More</a>';
  $html .= '</div>';

}

echo $html;

Example 2: ajax call to load a page on scrolling

CREATE TABLE `posts` (
  `id` int(11) NOT NULL PRIMARY KEY AUTO_INCREMENT,
  `title` varchar(100) NOT NULL,
  `description` text NOT NULL,
  `link` varchar(255) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;