Voir le sujet - Vignettes + agrandissement redimensionné automatiquement >> Aide à la conception de sites internet

Posté le: Sam 02 Oct 2004, 11:57 pm

Bonjour,

j'ai déjà posé ma uestion sur l'EJS mais à tout hasard, je me lance ici aussi.
Voilà, je travaille sur la création d'une galerie dynamique via le script SPIP.
Il s'agit en fait d'un squelette qui permet d'afficher les images jointes à un article, et ce, de manière automatique.

Le principe:

des vignettes... on clique sur une vignette et l'image taille réelle se charge dans un bloc <div> mais ne devant pas dépasser les valeurs width et height que nous aurons décidé. Cela impose donc, un redimensionnement auto. Ce redimensionnement permettra de ne pas prendre plus de place que précisé dans le div, afin d'éviter les bugs d'affichage.

Les forts sympathiques sirjojo et leris ont déjà commencé à travailler dessus, mais je crains que ce ne soit pas encore cela --> http://www.editeurjavascript.com/forum/topic,2,32796,0.html

Si vous voulez bien ajouter votre pierre pour me permettre de finir cette galerie... ce s'rai coooooooooooooooooooooool

Merci d'avance

aiglobulles

Inscrit le: 07 Sep 2004

Salut,

Voici un bout de code qui te permet de redimensioner une image proportionnelement en spécifiant la la hauteur et la largeur max... Donc je pense qu'en l'adaptant à ton script cela devrait marcher...

Code:

<html>
<head>
<script language="javascript">
function redimImage(inImg, inMW, inMH)
{
// Cette function recoit 3 parametres
// inImg : Chemin relatif de l'image
// inMW : Largeur maximale
// inMH : Hauteur maximale
var maxWidth = inMW;
var maxHeight = inMH;
// Declarations des variables "Nouvelle Taille"
var dW = 0;
var dH = 0;
// Declaration d'un objet Image
var oImg = new Image();
// Affectation du chemin de l'image a l'objet
oImg.src = inImg;
// On recupere les tailles reelles
var h = dH = oImg.height;
var w = dW = oImg.width;
// Si la largeur ou la hauteur depasse la taille maximale
if ((h >= maxHeight) || (w >= maxWidth)) {
// Si la largeur et la hauteur depasse la taille maximale
if ((h >= maxHeight) && (w >= maxWidth)) {
// On cherche la plus grande valeur
if (h > w) {
dH = maxHeight;
// On recalcule la taille proportionnellement
dW = parseInt((w * dH) / h, 10);
} else {
dW = maxWidth;
// On recalcule la taille proportionnellement
dH = parseInt((h * dW) / w, 10);
}
} else if ((h > maxHeight) && (w < maxWidth)) {
// Si la hauteur depasse la taille maximale
dH = maxHeight;
// On recalcule la taille proportionnellement
dW = parseInt((w * dH) / h, 10);
} else if ((h < maxHeight) && (w > maxWidth)) {
// Si la largeur depasse la taille maximale
dW = maxWidth;
// On recalcule la taille proportionnellement
dH = parseInt((h * dW) / w, 10);
}
}
// On ecrit l'image dans le document
document.writeln("<img src=\"" + inImg + "\" width=\"" + dW + "\" height=\"" + dH + "\" border=\"0\">");
};
</script>
</head>
<body>
<script language="JavaScript">
//Utilisation
redimImage('ton_image.jpg', 300, 300);
</script>
</body>
</html>

@+

Posté le: Dim 03 Oct 2004, 3:27 pm

hello redox,

merci pour le code.... seulement entre temps j'ai compris et réussi à installer un autre code qu'on m'avait donné et là ça fonctionne impec tant sous ie que firefox. ouf !!
En tous cas merci bcp

aiglobulles

Inscrit le: 07 Sep 2004

Ok bah c cool...
Bonne continuation dans ton projet