définir la taille de l'image à l'égard de la résolution de l'écran
Je suis en train de construire un site web pour moi.. je veux utiliser une image comme en-tête... j'ai fait en sorte que mon arrière-plan à l'échelle de lui-même pour toute résolution de l'écran... Comment puis-je m'assurer de l'image(en-tête) va aussi à l'échelle de soi selon la résolution de l'écran...
par exemple: mon image est 350px int largeur et 130px en hauteur.. je veux que ce soit la taille lors de la résolution d'écran est de 1280X768.., et les modifier de façon proportionnelle à la taille de l'écran..
S'il vous plaît dites-moi comment ce faire de préférence à l'aide de CSS.. je suis aussi bien avec js ou jquery
Merci d'avance
Raj
OriginalL'auteur Raj | 2010-02-25
Vous devez vous connecter pour publier un commentaire.
Si vous ne spécifiez la largeur et la css, la hauteur de l'échelle automatiquement. Vous pouvez facilement spécifier le avec de l'image par rapport à son parent.
Dans votre exemple, vous devez spécifier
width: 27%
(1280 /350). Notez que le parent devra être à 100% de largeur.OriginalL'auteur jeroen
Vous pouvez obtenir la taille de l'écran du DOM à l'aide de
screen.width
etscreen.height
. Ensuite, vous pouvez écrire un peu de JS pour charger ou remplacer par l'image de votre choix ou d'ajuster laheight
/width
attributs sur l'image (qui sera mise à l'échelle, mais ne regarde pas toujours génial).OriginalL'auteur Michael Pilat
Il y a un bon article sur les grilles fluides par Ethan Marcotte, http://www.alistapart.com/articles/fluidgrids/
Vous pouvez appliquer ces principes à vos images à l'aide de CSS, il le fait sur son site personnel. Il y a même de bonnes applications pour vous aider.
celui-ci a un read me -> web de canard
http://inteldesigner.com/web-duck/about.php
celui-ci a plus de fonctionnalités -> em calc
http://riddle.pl/emcalc/
OriginalL'auteur Kevin