11550 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

J'ai une partie avec plusieurs pages avec un système de pagination. Sur chaque page, il y a plusieurs "sujets" incorporés dans un système d'accordéon jQuery. Le soucis, c'est que sous Safari (et uniquement!), j'ai un léger décalage (très peu mais suffisamment gênant) entre l'affichage de la page sans le script et celle-ci avec le script. Ce qui est en plus étonnant, c'est que ce décalage n'est pas systématique.

Une réponse avancée (sur un autre forum) serait que les navigateurs, ayant des moteurs javascript divers, pourraient afficher la page avec un rendu différent.

Auriez-vous une idée??

Merci d'avance

Voici le code de la page en question:

<?php
session_start();

if(!isset($_SESSION['login']) OR !isset($_SESSION['password']) OR $_SESSION['login'] <> 'aze' OR $_SESSION['password'] <> 1234)
{
	header('location:requis_password.php');
}

else
{
?>
	<!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Administrateur</title>
    <script src="jquery-1.6.2.min.js" type="text/javascript"></script>	
    <link href="CSS/jquery-ui-1.8.18.custom.css" rel="stylesheet" type="text/css">
   	<script src="jquery-ui-1.8.18.custom.min.js" type="text/javascript"></script>
   	<link href="CSS/index.css" rel="stylesheet" type="text/css">
    <script>
		$(document).ready(function() {
    		$("#accordion").accordion({
				active: false,
				collapsible: true,
				autoHeight: false,
				navigation: true,
				})
  		});
	</script>
   	
	</head>
    
    <body>
  
   	<div id="container">
       
        <h1>Administrateur</h1>
        <p id="derniers">Billets du blog:</p>
       	<p id="ajouter_modifier"><a href="ajouter.php">Ajouter un billet</a></p>
    	<p class="ajout"><a href="ajouter.php"><img  src="images/ajouter.jpg" alt="ajouter" border="0"></a></p>
      
<?php
  
    //---------------------------------------------------------------------------------------------------
                        //CONNECTION A LA BASE DE DONNEES ET ON S'ASSURE QUE TOUT VA S'AFFICHER EN UTF8
  
		include('connexion_bdd.php');	
			
													
		$requete_billets_blog = $bdd->query('SELECT id, titre, contenu,  DATE_FORMAT(date_creation, "%d/%m/%Y à %Hh%imin%ss")
		AS date_creation FROM billets ORDER BY billets.date_creation DESC')  or die(print_r($connexion->errorInfo()));
	

	//--------------------------------------------------------------------------------------------------- 
                        // ON MET LE NOMBRE DE BILLETS QUE L'ON VEUT AFFICHER PAR PAGES
    
                                          
		$nombre_billets_pages = 7;
		
							// ON RECUPERE LE NOMBRE DE BILLETS TOTAL DANS LA BASE DE DONNEES
											
		$requete = $bdd->query('SELECT COUNT(*) AS nombre_total_de_billets FROM billets')->fetch();
		$nbrBillets = $requete['nombre_total_de_billets'];
		
		
						  // ON DETERMINE LE NOMBRE DE PAGES
						  
		$nombre_de_pages = ceil($nbrBillets/$nombre_billets_pages);	// "ceil" = ARRONDIR AU NOMBRE SUPERIEUR
		
    //---------------------------------------------------------------------------------------------------
	
		if(isset($_GET['page']) AND is_numeric($_GET['page']) AND $_GET['page'] <= $nombre_de_pages AND $_GET['page'] >0) 
		{
			$page = $_GET['page'];// LA VARIABLE DETERMINE LE NUMERO NUMERO DE PAGE
			
			//---------------------------------------------------------------------------------------------------
												// ON CALCULE LE NUMERO DU PREMIER MESSAGE A AFFICHER								 
		
			$premier_message_a_afficher = ($page - 1) * $nombre_billets_pages;

	//---------------------------------------------------------------------------------------------------

	// ON REALISE NOTRE REQUETE POUR OBTENIR LES 8 BILLETS (l'id, le titre, le contenu la date au format français sous le nom de date_creation) DANS LA TABLE BILLETS EN ORDRE DECROISSANT PAR RAPPORT A LA DATE DE CREATION
										
			$requete_billets_blog = $bdd->query('SELECT id, titre, contenu,  DATE_FORMAT(date_creation, "%d/%m/%Y à %Hh%imin%ss")
			AS date_creation FROM billets ORDER BY billets.date_creation DESC LIMIT ' .  $premier_message_a_afficher . ',' . $nombre_billets_pages . '') or die(print_r($connexion->errorInfo()));
			$_SESSION['nombre de billet']= $nbrBillets;
			
										  // ON REALISE UNE BOUCLE QUI NOUS AFFICHE LES BILLETS TANT QUE LA REQUETE DU DESSUS N'EST PAS COMPLETE
			echo '<div id="accordion">';
										  
				while ($donnees = $requete_billets_blog->fetch())
				{
					$id=$donnees['id'];
?> 					<p class="absolute">
						<a href="#"><?php echo stripslashes(htmlspecialchars($donnees['titre']));?></a>
						<input class="bouton_sup" type="button" onClick="document.location.href='supprimer.php?id=<?php echo $id;?>'; " value="Supprimer">
						<input class="bouton_mod" type="button" onClick="document.location.href='modifier.php?page=<?php echo $page;?>&amp;id=<?php echo $id;?>';" value="Modifier">
					</p>
					<p>
						<?PHP echo stripslashes(htmlspecialchars($donnees['contenu']));?>
					</p>
					
<?PHP	
				}
				
			echo '</div>';
		    
			include('pagination_function.php');
			echo '<p class="pagination">' . pagination($page, $nombre_de_pages, 'admin.php?page=%d' , 2, 1) . '</p>';
			echo '<p><img id="fleche_admin" src="images/fleche2.png"><a id="retour" href="index.php">Retour à la liste des billets</a></p>';
			
		}
		elseif(!isset($_GET['page'])) // SI LA VARIABLE EST VIDE ALORS (DETERMINE LA PREMIERE PAGE PUISQUE L'ON ARRIVE SUR INDEX.PHP SANS VARIABLE 
		{
			$page = 1;
			$premier_message_a_afficher = ($page - 1) * $nombre_billets_pages;

	//---------------------------------------------------------------------------------------------------

	// ON REALISE NOTRE REQUETE POUR OBTENIR LES 8 BILLETS (l'id, le titre, le contenu la date au format français sous le nom de date_creation) DANS LA TABLE BILLETS EN ORDRE DECROISSANT PAR RAPPORT A LA DATE DE CREATION
										
			$requete_billets_blog = $bdd->query('SELECT id, titre, contenu,  DATE_FORMAT(date_creation, "%d/%m/%Y à %Hh%imin%ss")
			AS date_creation FROM billets ORDER BY billets.date_creation DESC LIMIT ' .  $premier_message_a_afficher . ',' . $nombre_billets_pages . '') or die(print_r($connexion->errorInfo()));
			$_SESSION['nombre de billet']= $nbrBillets;	
			
										  // ON REALISE UNE BOUCLE QUI NOUS AFFICHE LES BILLETS TANT QUE LA REQUETE DU DESSUS N'EST PAS COMPLETE
			echo '<div id="accordion">';
										  
				while ($donnees = $requete_billets_blog->fetch())
				{
					$id=$donnees['id'];
?>	 				<p class="absolute">
						<a href="#"><?php echo stripslashes(htmlspecialchars($donnees['titre']))?></a>
						<input class="bouton_sup" type="button" onClick="document.location.href='supprimer.php?id=<?php echo $id;?>'; " value="Supprimer">
						<input class="bouton_mod" type="button" onClick="document.location.href='modifier.php?page=<?php echo $page;?>&amp;id=<?php echo $id;?>';" value="Modifier">
					</p>
					<p>
						<?PHP echo nl2br(stripslashes(htmlspecialchars($donnees['contenu'])));?>
					</p>
<?PHP			}
		
			echo '</div>';
				
			include('pagination_function.php');
			echo '<p class="pagination">' . pagination($page, $nombre_de_pages, 'admin.php?page=%d' , 2, 1) . '</p>';
			
			echo '<p><img id="fleche_admin" src="images/fleche2.png"><a id="retour" href="index.php">Retour à la liste des billets</a></p>';
		}
		else
		{
			include('erreur.php');
			 
		}
?>
	</div>
  	</body>
	</html>
<?php	
}
?>



Ps: J'ai essayé de déclarer les différents scripts dans un ordre différent, mais sans succès.
Re-bonjour,

Problème résolu... J'ai désactivé AdBlock dans les préférences de Safari et manifestement le problème a disparu... Je ne vois pas trop pourquoi...

Si quelqu'un pouvait m'éclairer, étant novice en javascript, je ne vois pas trop le rapport entre AdBlock et javascript.

Merci d'avance!