Trucsweb.com

Forum de discussion

 Forum « Programmation Javascript » (archives)

problèmes de prévisualisation et redimentionnement d'une image

Envoyé: 17 janvier 2005, 15h53 par dark666


salut,
Tout d'abord bravo pour ce site qui m'a permis de me faire les dents en javascript, je développe en php.Mon code :un formulaire (upload), et comme je veux allèger mon serveur quoi de plus normale de faire un contrôle de taille
et une prévisualisation d'un photo avec redimentionnement. j'ai donc fait un code en laissant mes remarques.
Il y a 2 problèmes à mon code c'est qu'il fonctionne si il y a un 'confirm' ou un 'alert' (si on l'enlève ça ne fonctionne pas),
Et le 2ème problème c'est que la prévisualisation fonctionne pour certaines images ou parfois même aléatoirement (peut-être faut-il 'réactiver' la page afin que certains paramètres JS soit pris en compte?) voici mon code :

<html>
<head>
<script type="text/javascript">
function verifPoids_redimentionimage(photo) // NE MARCHE PAS SOUS MOZILLA ET NETSCAPE (mais execute quand même l'upload)
{
// récupération de l'élément html dans lequel on affichera l'image à uploader
var elemImage= document.images("avatar");

// remplacement de l'image par changement de l'url source
elemImage.src= photo.value; // chemin = chemin relatif

// REDIMENTIONNEMENT DE L'IMAGE (Ratio:100)
var oImg = new Image();
oImg.src= photo.value
var imageX = oImg.width // largeur en pixels de l'image
var imageY = oImg.height // hauteur en pixels de l'image

if (imageX>100 || imageY>100) // vérifie si la largeur ou la hauteur de l'image est supérieur à 100 pour afficher la miniature
{
if (imageX>=imageY) // Calcule de la réduction et du ratio de l'image
{ // si l'image est de type paysage
imageY=(imageY/imageX)*100; // mettre la déclaration dans cette ordre car si c'est inversé la valeur 100 serait compter au lieu de la valeur 1024
imageX=100;
} else { // si l'image est de type portrait
imageX=(imageX/imageY)*100;
imageY=100;
}
}

document.images["avatar"].width = imageX; // affichage de l'image en pixels en largeur (X)
document.images["avatar"].height = imageY;// affichage de l'image en pixels en hauteur (Y)

// CONFIRMATION
var ok= confirm("confirmez votre choix");
if (ok==false) {
elemImage.src= "PHOTOS/nophoto.jpg";
document.images["avatar"].width = 100;
document.images["avatar"].height= 100;
}
// récupération du poids de l'image dans l'élément html
var poidsImage= elemImage.fileSize;
// test si poids > 150 Ko
if (poidsImage > 150*1024)
{
// message d'alerte avec poids converti en Ko
alert("Fichier trop gros ! ("+ Math.floor(poidsImage/1024) +" Ko)");
document.images["avatar"].width = 100;
document.images["avatar"].height= 100;
// remplacement par l'image d'origine
elemImage.src= "nophoto.jpg";
}
window.location.reload();
}
</script>
</head>
<body>
<img src="nophoto.jpg" name="avatar" id="avatar" style="border:1px solid black;">
<form method="post" name="formulairecompte" enctype="multipart/form-data" action="testupload.html">
<input name="fichier" type="file" onchange="verifPoids_redimentionimage(this)">
</form>
</body>
</html>

Merci d'avances de vos réponses et meilleurs voeux 2005 à tous!

DARK666


Réponses

 sp spRe: problèmes de prévisualisation et redimentionnement d'une image Oznog19/1/2005
 sp spRe: problèmes de prévisualisation et redimentionnement d'une image leica6928/5/2005
 sp spERRATUM : problèmes de prévisualisation et redimentionnement d'une image dark66617/1/2005
Aucun médias sociaux
X

Trucsweb.com Connexion

X

Trucsweb.com Mot de passe perdu

X

Trucsweb.com Conditions générales

Conditions

Responsabilité

La responsabilité des Trucsweb.com ne pourra être engagée en cas de faits indépendants de sa volonté. Les informations mises à disposition sur ce site le sont uniquement à titre purement informatif et ne sauraient constituer en aucun cas un conseil ou une recommandation de quelque nature que ce soit.

Aucun contrôle n'est exercé sur les références et ressources externes, l'utilisateur reconnaît que les Trucsweb.com n'assume aucune responsabilité relative à la mise à disposition de ces ressources, et ne peut être tenue responsable quant à leur contenu.

Droit applicable et juridiction compétente

Les règles en matière de droit, applicables aux contenus et aux transmissions de données sur et autour du site, sont déterminées par la loi canadienne. En cas de litige, n'ayant pu faire l'objet d'un accord à l'amiable, seuls les tribunaux canadien sont compétents.

X

Trucsweb.com Trucsweb

X

Trucsweb.com Glossaire

X

Trucsweb.com Trucsweb

X

Trucsweb.com Trucsweb

Conditions

Aucun message!

Merci.

X
Aucun message!
X

Trucsweb.com Créer un compte