Guest User

Untitled

a guest
Nov 29th, 2017
101
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.00 KB | None | 0 0
  1. $(document).ready(function(){
  2. $(window).scroll(function(){
  3. var lastID = $('.load-more').attr('lastID');
  4. if ($(window).scrollTop() == $(document).height() - $(window).height() && lastID != 0){
  5. $.ajax({
  6. type:'POST',
  7. url:'datos.php',
  8. data:'id='+lastID,
  9. beforeSend:function(html){
  10. $('.load-more').show();
  11. },
  12. success:function(html){
  13. $('.load-more').remove();
  14. $('#postList').append(html);
  15. }
  16. });
  17. }
  18. });
  19. });
  20.  
  21. <?php
  22. //DB details
  23. $dbHost = 'localhost';
  24. $dbUsername = 'root';
  25. $dbPassword = 'root';
  26. $dbName = 'shareiv';
  27.  
  28. //Create connection and select DB
  29. $db = new mysqli($dbHost, $dbUsername, $dbPassword, $dbName);
  30.  
  31. if ($db->connect_error) {
  32. die("Unable to connect database: " . $db->connect_error);
  33. }
  34. ?>
  35.  
  36. <?php
  37. //Include DB configuration file
  38. include('dbConfig.php');
  39. ?>
  40. <link rel="stylesheet" href="main.css">
  41. <script src="jquery.js"></script>
  42. <script src="ajax.js"></script>
  43. <div class="container">
  44. <div class="row">
  45. <div class="col-lg-12">
  46. <div class="post-list" id="postList">
  47. <?php
  48. //get rows query
  49. $query = $db->query("SELECT * FROM chat WHERE post=1 ORDER BY id DESC LIMIT 7");
  50. if($query->num_rows > 0){
  51. while($row = $query->fetch_assoc()){
  52. $postID = $row["id"];
  53. ?>
  54. <div class="list-item"><a href="javascript:void(0);"><h2><?php echo $row['mensaje']; ?></h2></a></div>
  55. <?php } ?>
  56. <div class="load-more" lastID="<?php echo $postID; ?>" style="display: none;">
  57. <img src="https://cdn.dribbble.com/users/503653/screenshots/3143656/fluid-loader.gif"/>
  58. </div>
  59. <?php } ?>
  60. </div>
  61. </div>
  62. </div>
  63. </div>
  64.  
  65. <?php
  66. if(isset($_POST["id"]) && !empty($_POST["id"])){
  67.  
  68. //Include DB configuration file
  69. include('dbConfig.php');
  70.  
  71. //Get last ID
  72. $lastID = $_POST['id'];
  73.  
  74. //Limit on data display
  75. $showLimit = 5;
  76.  
  77. //Get all rows except already displayed
  78. $queryAll = $db->query("SELECT COUNT(*) as mensaje FROM chat WHERE id < ".$lastID." ORDER BY id DESC");
  79. $rowAll = $queryAll->fetch_assoc();
  80. $allNumRows = $rowAll['mensaje'];
  81.  
  82. //Get rows by limit except already displayed
  83. $query = $db->query("SELECT * FROM chat WHERE id < ".$lastID." ORDER BY id DESC LIMIT ".$showLimit);
  84.  
  85. if($query->num_rows > 0){
  86. while($row = $query->fetch_assoc()){
  87. $postID = $row["id"]; ?>
  88. <div class="list-item"><a href="javascript:void(0);"><h2><?php echo $row["mensaje"]; ?></h2></a></div>
  89. <?php } ?>
  90. <?php if($allNumRows > $showLimit){ ?>
  91. <div class="load-more" lastID="<?php echo $postID; ?>" style="display: none;">
  92. <img src="loading.gif"/>
  93. </div>
  94. <?php }else{ ?>
  95. <div class="load-more" lastID="0">
  96. That's All!
  97. </div>
  98. <?php }
  99. }else{ ?>
  100. <div class="load-more" lastID="0">
  101. That's All!
  102. </div>
  103. <?php
  104. }
  105. }
  106. ?>
  107.  
  108. .post-list{
  109. margin-bottom:20px;
  110. }
  111. div.list-item {
  112. border-left: 4px solid #7ad03a;
  113. margin: 5px 15px 2px;
  114. padding: 1px 12px;
  115. background-color:#F1F1F1;
  116. -webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);
  117. box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);
  118. height: 60px;
  119. }
  120. div.list-item p {
  121. margin: .5em 0;
  122. padding: 2px;
  123. font-size: 13px;
  124. line-height: 1.5;
  125. }
  126. .list-item a {
  127. text-decoration: none;
  128. padding-bottom: 2px;
  129. color: #0074a2;
  130. -webkit-transition-property: border,background,color;
  131. transition-property: border,background,color;-webkit-transition-duration: .05s;
  132. transition-duration: .05s;
  133. -webkit-transition-timing-function: ease-in-out;
  134. transition-timing-function: ease-in-out;
  135. }
  136. .list-item a:hover{text-decoration:underline;}
  137. .load-more {
  138. margin: 15px 25px;
  139. cursor: pointer;
  140. padding: 10px 0;
  141. text-align: center;
  142. font-weight:bold;
  143. }
  144. .list-item h2{font-size:25px; font-weight:bold;text-align: left;}
Add Comment
Please, Sign In to add comment