bonjour je relance le message si parmis vous quelqu'un peu reprendre le code existant ou même trouvé une solution alternative je suis preneur merci à vous
Moi je trouvais le sujet assez intéressant alors j'vais juste mettre un message avec une solution a exploité. Elle n'est pas appliqué à phpBB mais avec un minimum de recherche, ce sera facilement adaptable (j'étais d'ailleurs entrain d'essayer avec mon forum quand j'ai vu ce message xD). C'est un script que j'ai écris à partir de divers recherches faites sur internet et de mes propres connaissances.
J'ai vu dans les messages précédents qu'il y avait de l'idée. Le problème est qu'à priori aucun d'entre vous n'a réellement suivi jusqu'au bout les cours sur l'Ajax avec JQuery. Et que vous vous êtes arrêter à un apprentissage de base du Javascript.
Je ne suis pas particulièrement expert en JQuery/Ajax, cela ne fait qu'un mois que je pratique réellement, mais vous n'avez pas pris en compte le fonctionnement même du DOM.
De plus, vous utilisez des fonctions qui vont à l'encontre même du principe de JQuery. Je parle évidemment de l'utilisation de onClick par exemple.
Pour terminer, je pars du principe qu'un bon code Ajax/JQuery est un code qui fonctionne aussi bien avec Javascript activé que désactivé. Exemple: Facebook est perdant sur ce point xD.
Donc l'idée est simplement d'ajouter une surcouche qui dynamise la page mais qui ne gène en rien une utilisation habituelle. Et surtout, qui ne tue pas le référencement. Qu'on en veuille ou pas. De plus, une vérification du temps d'exécution et du nombre des requêtes et à prendre en compte surtout que Javascript permet moyennement de faire une barre de progression pour faire patienter l'utilisateur. Et le gif animé qui tourne en boucle, ça va 1 minute. Et encore...
$(document).ready( function() {
// Chargement de l'évènement click sur a dans le DOM.
$("#transition").on("click", "a", function() {
var $tpa = $(this);
transpage($tpa.attr('title'), $tpa.attr('href'));
// Désactivation du lien
return false;
});
});
// Changement de la page par Ajax/Effect
function transpage (title, url, skipHistory)
{
// On fait disparaitre le bloc
$('#transition').slideToggle('slow', function() {
// On charge la page demandée
$(this).load(url, function() {
// Modification du titre
document.title = title;
// Ajout des états
var stateObj = {
title: title,
url: url
};
// Gestion de l'historique
if (!skipHistory)
{
if (typeof window.history.pushState == 'function')
{
window.history.pushState(stateObj, title, url);
}
}
// Apparision du bloc
$(this).slideToggle('slow');
});
});
}
window.onpopstate = function(event) {
//Si event.state est définie (c'est à dire que la page précédente fait partie de l'historique courant), on charge le contenu
if (event.state) {
transpage(event.state.title, window.location.pathname, true);
} else {
//Si event.state n'est pas définie, on créer un nouvel objet d'état
var stateObj = {
title: document.title,
url: window.location.pathname
};
//On modifie l'entrée actuelle
window.history.replaceState(stateObj,document.title,window.location.pathname);
}
}
<?php
if (empty($_SERVER['HTTP_X_REQUESTED_WITH']) || isset($_SERVER['HTTP_X_REQUESTED_WITH']) && $_SERVER['HTTP_X_REQUESTED_WITH']!="XMLHttpRequest") {
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Index :: DynPages</title>
<link rel="stylesheet" href="style.css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="dynpages.js"></script>
</head>
<body>
<div class="header">
<div class="bloc_header">
<div class="box_profile">
<a class="lien_tophide" href="http://pyroxty.finitia-world.com/">Cédric MONNIER</a>
<img class="img_barre_profile" src="" alt="" />
</div>
</div>
</div>
<p id="transition">
<?php
}
?>
<span class="pageindex">Ceci est un test de changement de page en HTML5/CSS et JQuery Ajax avec effet Slide.<br />
<a title="Test :: DynPages" href="test.php">Rejoignez la page de Test par Ajax+Effet</a><br />
<a title="Test :: DynPages" href="autre.php">Rejoignez l'autre page par Ajax+Effet</a></span>
<?php
if (empty($_SERVER['HTTP_X_REQUESTED_WITH']) || isset($_SERVER['HTTP_X_REQUESTED_WITH']) && $_SERVER['HTTP_X_REQUESTED_WITH']!="XMLHttpRequest") {
?>
</p>
</body>
</html>
<?php
}
?>
Notez que j'utilise $_SERVER['HTTP_X_REQUESTED_WITH']!="XMLHttpRequest" pour définir la partie a affiché une fois la requête Ajax envoyer. Ceci dit, vous pouvez aussi modifier le js pour afficher ce qu'il y a dans l'ID. Mais je préfère cette méthode qui risque moins d'être manipuler par une personne indésirable que l'id.
J'vous redirai si ça marche une fois en application sur mon forum. En attendant, amusez-vous bien ;).
× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
× Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
