JeuWeb - Crée ton jeu par navigateur
Redimensionnement forcé PB de rendu avec FF - Version imprimable

+- JeuWeb - Crée ton jeu par navigateur (https://jeuweb.org)
+-- Forum : Discussions, Aide, Ressources... (https://jeuweb.org/forumdisplay.php?fid=38)
+--- Forum : Programmation, infrastructure (https://jeuweb.org/forumdisplay.php?fid=51)
+--- Sujet : Redimensionnement forcé PB de rendu avec FF (/showthread.php?tid=4975)



Redimensionnement forcé PB de rendu avec FF - Argorate - 06-07-2010

Bonsoir,

J'ai une petit question pour changer^^
J'ai besoin de redimensionner (agrandir) une image de manière automatique et forcé de la manière suivante:

<img .... width="200" height="200" /> par exemple.

Et comme certains l'auront peut être remarqué, avec IE il n'y a pas de problème, mais FF embête beaucoup avec sa méthode de redimension qui floute les images!

Exemple:
[Image: screen_bug_img_gd_redimension.PNG]

J'ai besoin dans mon cas de garder l'image avec des beaux pixels bien distincts. Donc comment préciser l'algo de redimension? Ou comment faire pour que FF arrête de prendre des initiatives qu'on ne lui a pas demandées?

Merci.


RE: Redimensionnement forcé PB de rendu avec FF - Roworll - 06-07-2010

Mon premier réflexe serait de te dire : utilise une image avec une taille appropriée.

Les navigateurs utilisent leurs propres algorithmes pour adapter les images demandées.
Certains font du 'bicubic', d'autre travaillent en 'nearest', c'est selon les choix des devs.

Donc, si tu veux optimaliser le rendu d'une image en 200x200, met là à la taille désirée avec le rendu qui te convient en utilisant Gimp par exemple.

Maintenant, IE (à partir de la version 7) et FF (3.6) implémentent des options CSS qui permettent de spécifier certains paramètres de rendus pour les images redimensionnées.
Pour FF, ça se passe ici .

Il est à noté que l'algorithme par défaut d'IE est différent en version 7- (nearest-neighbor) et 8+ (bicubic). Pour ce navigateur, le paramètre CSS est -ms-interpolation-mode

Malheureusement, ces petites modifications du CSS sont propres à chaque navigateur. Même si cela corrige ton problème sous FF et que sous IE le rendu est potable, cela risque de flinguer la compatibilité W3C de ton CSS. De plus, que faire avec les algorithmes de redimensionnement d'Opera, de Chrome ou de Safari ? Faut-il espérer un support correct et/ou la possibilité de modifier le rendu ou plus simplement avoir une image à la bonne dimension ?


RE: Redimensionnement forcé PB de rendu avec FF - Mycroft - 06-07-2010

Sinon tu fais ton blason en svg et commet ça quelle que soit la taille, l'image sera aussi précise.

Bon courage Smile


RE: Redimensionnement forcé PB de rendu avec FF - Shudrum - 06-07-2010

Ouais, mais ça ne passe plus sur IE


RE: Redimensionnement forcé PB de rendu avec FF - Roworll - 06-07-2010

Sur IE9 ça passera.
Sur les autres, il faudra trouver des méthodes détournées (comme SVG Web ou l'utilisation du plugin Adobe par exemple)


RE: Redimensionnement forcé PB de rendu avec FF - Argorate - 06-07-2010

En fait c'était juste un exemple l'image que j'ai mise là. C'est pas du tout cette image qui m'interesse ^^
L'image en question est généré avec GD...
Je suis entrain de voir les fonctions dispo pour agrandir via GD, mais ça c'est un autre probléme, je voulais quand meme savoir pourquoi FF flouté comme ça, et comme tu me l'a confirmé Roworll, c'est l'algo qui n'est pas le même, et c'est bien embetant de ne pas pouvoir le choisir via une ligne de code, ça aurait était sympa. Smile

Bref, je pense utiliser imagecopyresampled() pour régler le problème, mais je trouve ça dommage d'en arrivé là.

PS: on devrait rajouter une status a mettre pour les poste du forum a la place de "résolu" => "Pas de solution" ^^


RE: Redimensionnement forcé PB de rendu avec FF - Anthor - 06-07-2010

Et pourquoi ne pas avoir les images de base en plus grand format, et les réduire plutôt ?


RE: Redimensionnement forcé PB de rendu avec FF - Argorate - 07-07-2010

C'est l'image de ma map, chaque pixel représente une case, donc impossible de modifier la dimenssion de base de l'image en question.
Mais j'ai besoin qu'a l'affichage se soit 3 fois plus gros que l'image de base (qui est trop petite)... d'où l'agrandissement.

J'ai donc utilisé imagecopyresampled() et ça marche bien Smile Plus de flou sous FF! Wink