Salut à tous. Je suis à la recherche d'un petit coup de main, avant de me balancer par la fenêtre. Je ne vais pas dire que je débute, mais je suis loin d'être un expert en développement de sites. Je me débrouille un peu.
Je suis en pleine réalisation d'un site pour un ami. j'ai plusieurs requêtes; je sais j'abuse... mais c'est pas souvent.
Le site se trouve à SigaArtCréation
Première question:
Je me suis rendu compte que mon texte de revenait pas à la ligne sous IE, alors que sous FF oui, d'où cela peut il venir. J'ai été obligé d'ajouter à mon code des '<br>' (cf page Accueil).
Deuxième question (et la plus importante):
je suis entrain de réaliser un zoom lors du passage de la souris sur des images. J'ai trouvé un bout de code que j'ai adapté.
Par contre le résultat n'est déjà pas le même entre IE et FF, et dans les deux cas de toute façon le résultat est loin d'être satisfaisant. Par exemple sous FF, ma zone d'affichage des images est correcte (cadre bordeaux) alors que sous IE, il disparait en hauteur. Ensuite pour le survol, sous IE les zooms sur les images de la 4ème colonne disparaissent, alors que sous FF, ils n'apparaissent même pas.
Alors ma requête est de savoir si quelqu'un de trè très généreux et adorable pouvait scruter mon source et me dire cce qui ne va pas. Me jetez pas de pierres, c'est déjà assez douloureux comme ça.
voici le source de ma page qui affiche les images :


<?php
session_start();
include('config.inc');

$base = mysql_connect ($host, $user, $mdp); 
mysql_select_db ($db, $base);

// on teste si une entrée de la base contient ce couple login / pass
$sql = 'SELECT count(id) FROM siga_collection';
$req = mysql_query($sql) or die('Erreur SQL !<br />'.$sql.'<br />'.mysql_error());
$row = mysql_fetch_array($req);
$total = $row[0];
mysql_free_result($req);

// on teste si une entrée de la base contient ce couple login / pass
$sql = 'SELECT id,nom_coll,img_coll FROM siga_collection';
$req = mysql_query($sql) or die('Erreur SQL !<br />'.$sql.'<br />'.mysql_error());

?>
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>Siga-Art-Cr&eacute;ation : toutes nos collections de cartes haut de gamme</title>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
		<link href="css/styles.css" rel="stylesheet" type="text/css" media="all" />	
		<style type="text/css">
			<!--
			.Style1 {
				font-family: Arial, Helvetica, sans-serif;
				font-weight: bold;
				font-size: 15px;
			}
			.Style3 {font-size: 11px; font-family: Arial, Helvetica, sans-serif;}
			.Style5 {font-family: Arial, Helvetica, sans-serif; font-weight: bold; font-size: 17px; }
			.Style6 {font-size: 14px}
			.Style8 {
				font-family: "Times New Roman", Times, serif;
				font-weight: bold;
				font-size: 20px;
				font-style: italic;
				color: #660000;
			}
			.Style9 {
				font-family: "Times New Roman", Times, serif;
				font-size: 11px;
			}
			.Style10 {color: #660000}
			.Style11 {
				font-size: 9px;
				font-style: italic;
			}
			-->
		</style>						
	</head>
<body bottommargin="0" leftmargin="0" marginheight="0" marginwidth="0" topmargin="0" rightmargin="0">
<center>		
	<script language="JavaScript" type="text/javascript">
	iens6=document.all||document.getElementById
	ns4=document.layers
	var speed=10
	if (iens6){
	document.write('<div align="center" id="container" style="position:relative;width:95%;height:95%;overflow:hidden;border:1px solid #660000">')
	document.write('<div align="center" id="content" style="position:absolute;width:95%;height:95%;overflow:hidden;left:0;top:0">')
	}
	</script>
	<script language="JavaScript1.2" src="Trailimage.js" type="text/javascript"></script>
			<?
			echo '<Center><table id="Tableau_01" width="90%" border="1" cellpadding="0" cellspacing="0">';
			echo '<tr>';
			echo '	    <td height="15" colspan="4" align="center" valign="middle" class="Style8">Nos Collections </td>';
			echo '</tr>';
			//si on a récupéré un résultat on l'affiche
			if ($total)
				{
				//début du tableau	
				while($row =mysql_fetch_array($req))
					{	 
						
						echo '<tr valign="middle">';						
						echo '	<td width="160" height="160" valign="top">';
						echo '		<table width="100%" cellpadding="0" cellspacing="0">';
						echo '			<tr valign="middle">';
						echo '				<td width="145" height="145" valign="middle" align="center"><a href="panier/liste_article.php?collection='.$row['id'].'"><img src="miniature.php?pic=collections/'.$row['img_coll'].'&w_max=140&h_max=140" hspaces="5" border="0" alt="'.$row['nom_coll'].'" title="'.$row['nom_coll'].'" onMouseOver="showtrail(400,0,\'collections/'.$row['img_coll'].'\')" onmouseout="hidetrail();"></a></td>';
						echo '			</tr>';
						echo '			<tr>';
						echo '				<td height="20" valign="middle" align="center" class="all Style9"><span class="Style10">'.$row['nom_coll'].'</span></td>';
						echo '			</tr>';
						echo '		</table>';
						echo '	</td>';
						if($row = mysql_fetch_array($req))
						{
							echo '	<td width="160" height="160" valign="top">';
							echo '		<table width="100%" cellpadding="0" cellspacing="0">';
							echo '			<tr valign="middle">';
							echo '				<td width="145" height="145" valign="middle" align="center"><a href="liste_cartes.php?collection='.$row['id'].'"><img src="miniature.php?pic=collections/'.$row['img_coll'].'&w_max=140&h_max=140" hspaces="5" border="0" alt="'.$row['nom_coll'].'" title="'.$row['nom_coll'].'" onMouseOver="showtrail(400,0,\'collections/'.$row['img_coll'].'\')" onmouseout="hidetrail();"></a></td>';
							echo '			</tr>';
							echo '			<tr>';
							echo '				<td height="20" valign="middle" align="center" class="all Style9"><span class="Style10">'.$row['nom_coll'].'</span></td>';
							echo '			</tr>';
							echo '		</table>';
							echo '	</td>';
						}
						if ($row = mysql_fetch_array($req))
						{
							echo '	<td width="160" height="160" valign="top">';
							echo '		<table width="100%" cellpadding="0" cellspacing="0">';
							echo '			<tr valign="middle">';
							echo '				<td width="145" height="145" valign="middle" align="center"><a href="liste_cartes.php?collection='.$row['id'].'"><img src="miniature.php?pic=collections/'.$row['img_coll'].'&w_max=140&h_max=140" hspaces="5" border="0" alt="'.$row['nom_coll'].'" title="'.$row['nom_coll'].'" onMouseOver="showtrail(400,0,\'collections/'.$row['img_coll'].'\')" onmouseout="hidetrail();"></a></td>';
							echo '			</tr>';
							echo '			<tr>';
							echo '				<td height="20" valign="middle" align="center" class="all Style9"><span class="Style10">'.$row['nom_coll'].'</span></td>';
							echo '			</tr>';
							echo '		</table>';
							echo '	</td>';	
						}
						if ($row = mysql_fetch_array($req))
						{
							echo '	<td width="160" height="160" valign="top" align="center">';
							echo '		<table width="100%" cellpadding="0" cellspacing="0">';
							echo '			<tr valign="middle">';
							echo '				<td width="145" height="145" valign="middle" align="center"><a href="liste_cartes.php?collection='.$row['id'].'"><img src="miniature.php?pic=collections/'.$row['img_coll'].'&w_max=140&h_max=140" hspaces="5" border="0" alt="'.$row['nom_coll'].'" title="'.$row['nom_coll'].'" onMouseOver="showtrail(400,0,\'collections/'.$row['img_coll'].'\')" onmouseout="hidetrail();"></a></td>';
							echo '			</tr>';
							echo '			<tr>';
							echo '				<td height="20" valign="middle" align="center" class="all Style9"><span class="Style10">'.$row['nom_coll'].'</span></td>';
							echo '			</tr>';
							echo '		</table>';
							echo '	</td>';
						}
						echo '</tr>';
					}
				}
			
			echo '</table></center>';
			?>

	<script language="JavaScript1.2" type="text/javascript">
	if (iens6)
	document.write('</div></div>')
	</script>
	<tr>
		<td height="26" colspan="2" align="center" valign="bottom"><a href="#" onmouseover="moveup()" onmouseout="clearTimeout(moveupvar)" alt="D&eacute;placer vers le haut" title="D&eacute;placer vers le haut"><img src="images/haut_1.gif" border="0" /></a>  <a href="#" onmouseover="movedown()" onmouseout="clearTimeout(movedownvar)" alt="D&eacute;placer vers le bas" title="D&eacute;placer vers le bas"><img src="images/bas_1.gif" border="0" /></a></td>
	</tr>

	<script language="JavaScript" type="text/javascript">
	if (iens6){
	var crossobj=document.getElementById? document.getElementById("content") : document.all.content
	var contentheight=crossobj.offsetHeight-163
	}
	else if (ns4){
	var crossobj=document.nscontainer.document.nscontent
	var contentheight=crossobj.clip.height-163
	}
	
	function movedown(){
	if (iens6&&parseInt(crossobj.style.top)>=(contentheight*(-1)+100))
	crossobj.style.top=parseInt(crossobj.style.top)-speed
	else if (ns4&&crossobj.top>=(contentheight*(-1)+100))
	crossobj.top-=speed
	movedownvar=setTimeout("movedown()",100)
	}
	
	function moveup(){
	if (iens6&&parseInt(crossobj.style.top)<=0)
	crossobj.style.top=parseInt(crossobj.style.top)+speed
	else if (ns4&&crossobj.top<=0)
	crossobj.top+=speed
	moveupvar=setTimeout("moveup()",100)
	
	}
	
	function getcontent_height(){
	if (iens6)
	contentheight=crossobj.offsetHeight-163
	else if (ns4)
	document.nscontainer.document.nscontent.visibility="show"
	}
	window.onload=getcontent_height-163
	</script>		
</center>
</body>
</html>


Merci de votre aide Smiley ohwell
Une dernière chose, IE me met une erreur au niveau de la ligne 90 : if($row = mysql_fetch_array($req)), why that.

Est ce que IE serait une m... innomable face à FF ou c moi qui merde totalement, et je devrais stopper la céation de sites???? Smiley bawling
Modifié par lelapinou (19 May 2007 - 01:15)
a écrit :
Est ce que IE serait une m... innomable face à FF ou c moi qui merde totalement, et je devrais stopper la céation de sites???? bawling

Tu as en effet d'avantage de raison de penser cela puisque ton document est
en mode de compatibilité descendante qu'on appel aussi mode quirks et
que cela provoque des différences d'affichage plus importantes dues entre
autres au modèle de boîte microsoft et à des implémentation propriétaires.
Pour basculer en mode standard tu dois donc ajouter un doctype complet
en haut du document.
Dans ton cas tu devrais commencer par un doctype html4 transitionnnal si
tu ne souhaites pas corriger (XMLiser) toute la syntaxe de ton code html et convertir
les attributs de présentation en règles CSS.
Mais pourquoi n'utilises tu pas CSS?
Modifié par Hermann (19 May 2007 - 02:36)
Smiley eek merci de ta réponse, mais j'ai peur de pas tout comprendre.
J'ai bien compris l'intérêt des DOCTYPEs, mais cela ne change rien à mon soucis d'interprétation, si tu ouvre le lien suivant sous FF et sous IE tu verras ce que je veux expliquer au niveau de mon post.

Collections
on voit bien que sous IE, le cadre bordeaux dépasse en hauteur, et que l'effet zoom sur les images fonctionne bien sur les 3 premières colonnes et pas sur la dernière. Aurais tu une idée là dessus.

Et en quoi le fait d'utiliser un CSS pourrait m'aider? Smiley murf
lelapinou a écrit :
J'ai bien compris l'intérêt des DOCTYPEs, mais cela ne change rien à mon soucis d'interprétation

La présence ou l'absence d'un doctype en haut de ta page change au contraire complètement la donne pour ce qui est de l'interprétation de tes pages.

Il n'est absolument pas conseillé de travailler en mode Quirks, c'est à dire avec une page n'ayant pas de Doctype. Corriger tes problèmes de rendu, si tu restes en mode Quirks, sera assez difficile et le résultat sera probablement très aléatoire.

Lire l'article suivant :
http://css.alsacreations.com/Bases-et-indispensables/DTD-comment-choisir

La consigne est donc : un doctype valide en début de chaque page, et après ça on reparle des problèmes de rendu rencontrés.
J'ai bien suivi vos indications et j'ai ajouté ce doctype '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//FR" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">' après lecture des articles cités.
Maintenant quand j'exécute mes pages de visualisation de catalogue je ne vois plus rien, oups!