Barre de défilement infini comme facebook

Résolu/Fermé

Cassie691 Messages postés 35 Date d'inscription mardi 15 septembre 2015 Statut Membre Dernière intervention 6 juillet 2020 - 28 janv. 2016 à 14:09
Cassie691 Messages postés 35 Date d'inscription mardi 15 septembre 2015 Statut Membre Dernière intervention 6 juillet 2020 - 30 janv. 2016 à 12:27

Bonjour,
j'ai récupérer un script qui fonctionne parfaitement pour but de créer un défilement comme facebook fur à mesure que je descend je vois apparaître les résultats de ma BDD sauf quand je l'intègre sur mon site ca ne fonctionne pas .. 2 jours que je recherche sur le web et que je ne trouve pas de solution au problème ..
Voici les scripts: (Infinite scroll)

Php -> ( ca fonctionne ).

<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<link rel="stylesheet" type="text/css" href="style.css" />
<img id='loading' src='img/loading.gif'>
<div id="demoajax" cellspacing="0">
</div>
<script type="text/javascript" src="script.js"></script>

Et à l'intégration sur mon site:
Php -> ( Fonctionne pas )

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Page Sans Titre</title>
<meta name="generator" content="Tjars">
<link href="Sans.css" rel="stylesheet">
<link href="index.css" rel="stylesheet">
</head>
<body>
<div id="Html1" style="position:absolute;left:115px;top:12px;width:937px;height:455px;z-index:0">

<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<link rel="stylesheet" href="style.css" />
<img id='loading' src='img/loading.gif'>
<div id="demoajax" cellspacing="0">
</div>
<script src="script.js"></script>

</div>
</body>
</html>

Sur mon site il va afficher les 10 premier résultats de la BDD mais quand je vais vouloir descendre le barre de défilement il ne se passe rien alors que le script seule ( sans intégration sur mon site ) fonctionne, si je descend avec la barre de défilement il m'affichera fur à mesure les résultats ( par 10 ).

Pourquoi ? Je comprends pas pourquoi ca ne fonctionne pas sur mon site, sachant que le script n'est pas modifier il est simplement incrusté .. :(

Je vous remercie d'avance pour vos réponses, A très bientôt !

( Les scripts qui vont avec )

<?php
include('dbs.php');
$limit = 10;
 if(isset($_REQUEST['actionfunction']) && $_REQUEST['actionfunction']!=''){
$actionfunction = $_REQUEST['actionfunction'];
  
   call_user_func($actionfunction,$_REQUEST,$db,$limit);
}
function showData($data,$db,$limit){
  $page = $data['page'];
   if($page==1){
   $start = 0;  
  }
  else{
  $start = ($page-1)*$limit;
  }
  
  $sql = "select * from articles order by id desc limit $start,$limit";
  $str='';
  $data = $db->query($sql);
  if($data!=null && $data->num_rows>0){
   while( $row = $data->fetch_array(MYSQLI_ASSOC)){
      $str.="<div class='data-container'><p>".$row['id']."</p><p>".$row['titre']."</p><p>".$row['message']."</p></div>";
   }
   $str.="<input type='hidden' class='nextpage' value='".($page+1)."'><input type='hidden' class='isload' value='true'>";
   }else{
    $str .= "<input type='hidden' class='isload' value='false'><p>Finished</p>";
   }
  
   
echo $str; 

}

?>

var ajax_arry=[];
 var ajax_index =0;
 var sctp = 100;
 $(function(){
   $('#loading').show();
 $.ajax({
      url:"scroll.php",
                  type:"POST",
                  data:"actionfunction=showData&page=1",
        cache: false,
        success: function(response){
     $('#loading').hide();
    $('#demoajax').html(response);
     
  }
  
    });
 $(window).scroll(function(){
       
    var height = $('#demoajax').height();
    var scroll_top = $(this).scrollTop();
    if(ajax_arry.length>0){
    $('#loading').hide();
    for(var i=0;i<ajax_arry.length;i++){
      ajax_arry[i].abort();
    }
 }
    var page = $('#demoajax').find('.nextpage').val();
    var isload = $('#demoajax').find('.isload').val();
    
      if ((($(window).scrollTop()+document.body.clientHeight)==$(window).height()) && isload=='true'){
     $('#loading').show();
    var ajaxreq = $.ajax({
      url:"scroll.php",
                  type:"POST",
                  data:"actionfunction=showData&page="+page,
        cache: false,
        success: function(response){
     $('#demoajax').find('.nextpage').remove();
     $('#demoajax').find('.isload').remove();
     $('#loading').hide();
     
    $('#demoajax').append(response);
   
  }
  
    });
    ajax_arry[ajax_index++]= ajaxreq;
    
    }
 return false;
 
 if($(window).scrollTop() == $(window).height()) {
       alert("bottom!");
   }
 });

});

 #demoajax{
 margin-top: 100px;}
 
 #demoajax .data-container{
 width: 700px;
    
 margin:10px auto;
 font-family:Tahoma,Arial,Verdana,sans-serif;
 font-size:13px;
 padding:4px;
 border:1px solid #d1d1d1;
 overflow:hidden;
  }

 #demoajax .data-container p{
    width:200px;
    padding: 8px;
 float:left;
 text-transform:capitalize;
  }
  
  #loading{
  display:none;
  position:fixed;
  left:50%;
  top:50%;
  }
  
  #mhead{
background-color: #f5f5f5;
border: 1px solid #e3e3e3;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
text-align: center; 
font-family: georgia;
position: fixed;
top: 0px;
width: 100%;
}

A voir également:

Barre de défilement infini comme facebook
Piratage facebook changer mot de passe - Guide
Compte facebook piraté - Guide
Qui regarde mon profil facebook - Guide
Sondage facebook - Guide
Story facebook - Guide

2 réponses

Réponse 1 / 2

Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 524
29 janv. 2016 à 11:12

Salut,

Vérifie dans la console de développement de ton navigateur (raccourci F12) si tu as des erreurs javascript.

Essaye également de déplacer tes balises link et script dans la balise head de ton document html :

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Page Sans Titre</title>
<meta name="generator" content="Tjars">
<link href="Sans.css" rel="stylesheet">
<link href="index.css" rel="stylesheet">
<link rel="stylesheet" href="style.css" />
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="script.js"></script>
</head>
<body>
<div id="Html1" style="position:absolute;left:115px;top:12px;width:937px;height:455px;z-index:0">

<img id='loading' src='img/loading.gif'>
<div id="demoajax" cellspacing="0">
</div>

</div>
</body>
</html>

Bonne journée

Réponse 2 / 2

Cassie691 Messages postés 35 Date d'inscription mardi 15 septembre 2015 Statut Membre Dernière intervention 6 juillet 2020 5
30 janv. 2016 à 12:27

Merci de ta réponse du coup j'ai créer le même moi même et tout fonctionne !

Discussions similaires

compte facebook piraté et adresse email changé

Que signifie "Utilisateur de Facebook" ?

Pourquoi je n'arrive plus à voir les anniversaires de mes amis sur Facebook ?

Cheques kadeos infini

Barre verticale droite sur clavier

Discussions similaires

Newsletters