par
Aureusms » 02 janv. 2009, 20:40
Je te propose un truc
Ton problème aussi réside dans les images que tu dois afficher en arrière plan pour éviter (si elles sont de grosses tailles) d'avoir des ralentissements
Le but de la manœuvre est de jouer avec les CSS et de la propriété display.
Je pense que ce script simplifié peut fonctionner.
<?php
//stockage du nom des images car elles de même extention (jpg) et dans le même dossier
$tab_image = array ("snap0","snap1","snap2","snap3","snap4","snap5","snap6","snap7","snap8","snap9");
$tab_alt_image = array ("ALT de l'image 0","ALT de l'image 1","ALT de l'image 2","ALT de l'image 3","ALT de l'image 4","ALT de l'image 5","ALT de l'image 6","ALT de l'image 7","ALT de l'image 8","ALT de l'image 9");
$tab_title_image = array ("Title de l'image 0","Title de l'image 1","Title de l'image 2","Title de l'image 3","Title de l'image 4","Title de l'image 5","Title de l'image 6","Title de l'image 7","Title de l'image 8","Title de l'image 9");
?>
<head>
<SCRIPT type="text/JavaScript">
<![CDATA[
var dernier = <?php echo count($tab_image); ?>;
function affiche_image ()
{
if (i = 0)
{
document.getElementById(dernier).style.display = "none";
document.getElementById(i).style.display = "block";
i++;
}
if (i > 0 && i < dernier)
{
document.getElementById(i).style.display = "block";
var precedent = i-1;
document.getElementById(precedent).style.display = "none";
i++;
}
if (i == dernier)
{
document.getElementById(i).style.display = "block";
var precedent = i-1;
document.getElementById(precedent).style.display = "none";
i = 0;
}
}
}
]]>
</SCRIPT>
</head>
<body>
<?php
foreach ($tab_image as $cle => $valeur)
{
?>
<div id="<?php echo $cle;?>"
style="display:<?php echo ($cle == 0) ? "block;" : "none;"; ?>"
onMouseOver="javascript:var timer=setInterval('affiche_image()', 1000);"
onMouseOut="javascript:clearInterval(timer);">
<img src="<?php echo "img/".$valeur.".jpg"; ?>"
alt="<?php echo $tab_alt_image[$cle]; ?>"
title="<?php echo $tab_title_image[$cle]; ?>"
style="width:250px; height:100px; filter:progid:DXImageTransform.Microsoft(MaxSquare=1,Duration=1);"
border="5"
/>
</div>
<?php
}
?>
</body>
Je te propose un truc
Ton problème aussi réside dans les images que tu dois afficher en arrière plan pour éviter (si elles sont de grosses tailles) d'avoir des ralentissements
Le but de la manœuvre est de jouer avec les CSS et de la propriété display.
Je pense que ce script simplifié peut fonctionner.
[php]<?php
//stockage du nom des images car elles de même extention (jpg) et dans le même dossier
$tab_image = array ("snap0","snap1","snap2","snap3","snap4","snap5","snap6","snap7","snap8","snap9");
$tab_alt_image = array ("ALT de l'image 0","ALT de l'image 1","ALT de l'image 2","ALT de l'image 3","ALT de l'image 4","ALT de l'image 5","ALT de l'image 6","ALT de l'image 7","ALT de l'image 8","ALT de l'image 9");
$tab_title_image = array ("Title de l'image 0","Title de l'image 1","Title de l'image 2","Title de l'image 3","Title de l'image 4","Title de l'image 5","Title de l'image 6","Title de l'image 7","Title de l'image 8","Title de l'image 9");
?>
<head>
<SCRIPT type="text/JavaScript">
<![CDATA[
var dernier = <?php echo count($tab_image); ?>;
function affiche_image ()
{
if (i = 0)
{
document.getElementById(dernier).style.display = "none";
document.getElementById(i).style.display = "block";
i++;
}
if (i > 0 && i < dernier)
{
document.getElementById(i).style.display = "block";
var precedent = i-1;
document.getElementById(precedent).style.display = "none";
i++;
}
if (i == dernier)
{
document.getElementById(i).style.display = "block";
var precedent = i-1;
document.getElementById(precedent).style.display = "none";
i = 0;
}
}
}
]]>
</SCRIPT>
</head>
<body>
<?php
foreach ($tab_image as $cle => $valeur)
{
?>
<div id="<?php echo $cle;?>"
style="display:<?php echo ($cle == 0) ? "block;" : "none;"; ?>"
onMouseOver="javascript:var timer=setInterval('affiche_image()', 1000);"
onMouseOut="javascript:clearInterval(timer);">
<img src="<?php echo "img/".$valeur.".jpg"; ?>"
alt="<?php echo $tab_alt_image[$cle]; ?>"
title="<?php echo $tab_title_image[$cle]; ?>"
style="width:250px; height:100px; filter:progid:DXImageTransform.Microsoft(MaxSquare=1,Duration=1);"
border="5"
/>
</div>
<?php
}
?>
</body>[/php]