Barre de défilement infini comme facebook
Résolu
Cassie691
Messages postés
35
Date d'inscription
Statut
Membre
Dernière intervention
-
Cassie691 Messages postés 35 Date d'inscription Statut Membre Dernière intervention -
Cassie691 Messages postés 35 Date d'inscription Statut Membre Dernière intervention -
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 ).
Et à l'intégration sur mon site:
Php -> ( Fonctionne pas )
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 )
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
- Story facebook comment ça marche - Guide
- Windows 11 barre des taches a gauche - Guide
- Voir qui regarde mon profil facebook - Guide
- Facebook lite gratuit - iam - Télécharger - Messagerie
- Compte facebook désactivé - Guide
2 réponses
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 :
Bonne journée
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
