28172 sujets

CSS et mise en forme, CSS3

Hey hey !

Avec des tailles maximum en pixels, j'ai bien essayé ça :


width: expression(document.body.clientWidth >= 700? "700px" : "auto");
height: expression(document.body.clientHeight >= 430? "430px" : "auto");


Mais les images sont étirées et c'est moche ! Toutes les autres solutions utilisant expression me donnent le même résultat... Smiley decu
Bonjour,

Pour commencer, les propriétés max-width et max-height sont comprises par Internet Explorer 7 et 8. Le cas IE6 peut se traiter de deux manières:
- Soit en utilisant un script JavaScript, appliqué à IE6 uniquement, qui va récupérer les dimensions d'un élément, et appliquer une dimension maximale si la dimension réelle est plus grande.
- Soit en ne faisant strictement rien, et tant pis pour cet effet dans IE6. Dans certains cas, ce genre de dégradation peut être acceptable, si ça reste léger ou accessoire.

Utiliser expression() revient à exploiter une solution JavaScript très simple, mais avec un impact assez négatif sur les performances (comme mentionné ici, d'ailleurs). C'est plutôt déconseillé. Mieux vaut écrire un script JS en bonne et due forme, ce qui sera beaucoup plus souple.

Angy a écrit :
Mais les images sont étirées et c'est moche !

Ah bon, il y avait des images dans cette histoire?
Modifié par Florent V. (13 Jun 2009 - 18:30)
Okay c'est parti pour un peu de JavaScript Smiley smile
Désolé je n'ai pas été très clair, c'était bien pour redimensionner des images par rapport à un cadre ! J'ai tenté ça :


function afficher(plop) {
	if ((document.getElementById("diapo").width >= document.getElementById("diapo").height) && (document.getElementById("diapo").width >= 700)) {
		document.getElementById("diapo").style.width='700px';
		document.getElementById("diapo").style.height='';
	} 
		
	if ((document.getElementById("diapo").width < document.getElementById("diapo").height) && (document.getElementById("diapo").height >= 430)) {
		document.getElementById("diapo").style.height='430px';
		document.getElementById("diapo").style.width='';
	}		
}


Mais j'ignore pourquoi, ça ne fonctionne pas pour une de mes images qui est vraiment très large. Quel est le problème ?
Modifié par Angy (13 Jun 2009 - 19:50)
Angy a écrit :
Mais j'ignore pourquoi, ça ne fonctionne pas pour une de mes images qui est vraiment très large.

Peut-être parce qu'elle n'est pas chargée au moment où la fonction JS est utilisée?
Possible...
Est-ce possible de récupérer les dimensions d'une image avant de la charger ? Uniquement en Javascript bien sûr ^^ En PHP je sais que c'est possible mais bon
Angy a écrit :
Est-ce possible de récupérer les dimensions d'une image avant de la charger ? Uniquement en Javascript

Non.