Redimentionnement de mon menu selon la résolution de l'écran.

Redimentionnement de mon menu selon la résolution de l'écran. - HTML/CSS - Programmation

Marsh Posté le 21-02-2006 à 22:44:28    

Bonjour,
 
Je suis en train de faire un site avec un menu en haut (le menu est défini par une image), j'aimerai savoir s'il est possible de définir la taille de ce menu selon la configuration de l'écran de la personne qui visitera ce site (le menu doit prendre toute la longueur de l'écran que l'on soit en 800*600, 1024*768, etc).
 
J'ai besoin que cela soit possible aussi bien sous Internet Explorer que sous les autres navigateur...
 
Est-ce possible ?
 
Merci d'avance.

Reply

Marsh Posté le 21-02-2006 à 22:44:28   

Reply

Marsh Posté le 21-02-2006 à 22:50:26    

tu entends quoi par "le menu est défini par une image"
 
sinon si tu fais les tailles en % tout ira bien

Reply

Marsh Posté le 21-02-2006 à 22:56:36    

http://kondratek.nicolas.neuf.fr/SOLUFIZ/accueil/menuHaut.png
 
voila dans la page html j'ai mis une image (celle ci dessus) ca sera mon menu.

Reply

Marsh Posté le 21-02-2006 à 23:21:51    

En javascript tu peux récupérer le document.widht(); mais c est pas terrible, la syntaxe exacte dépends du navigateur et tu devra écrire tout le menu en javascript.
 
Par contre, vu ton image, tu peux la couper, et avec un peu de DHTML tu plaque le menu au dessus de l image.
Tu coupes aux 2/3 en largeur, que tu places dans la première case d un tableau, et tu met un background jaune dans une deuxième case de tableau.
Par dessus tu rajoute un <div></div> avec le menu à l intérieur et un peu de CSS pour rendre le div transparent et redimensionnable à la taille du document.
Pour le CSS, tu trouveras de la doc sur w3.org

Reply

Marsh Posté le 21-02-2006 à 23:26:22    

Ah ouais, j avais pas vu l image en entier...
Tu la coupes plutot en 3. Partie gauche et droite de taille fixe. Partie centrale redimensionnable avec cellule de tableau TD width=100% background=image centrale répétable en horizontale.

Reply

Marsh Posté le 23-02-2006 à 21:30:50    

Tu fais deux CSS l'un adapté à 1024, l'autre à 800*600.
Après avec javascript tu trouves la résolution et tu balances l'un ou l'autre des CSS. Enfin c'est juste un conseil.
 
Si tu gardes un width=100%, le problème c'est que le texte que tu auras dessus sera lui aussi redimensionné sur la page, avec des problèmes de chevauchement, etc.

Reply

Marsh Posté le 24-02-2006 à 00:02:37    

oula faut apprendre le javascript alors...

Reply

Marsh Posté le 24-02-2006 à 00:14:14    

Si tu utilise ma solution, tu peut t en tirer sans.
Tu coupes l image en 3, dans un tableau,
genre:
1ère case, largeur fixe 200 pxl, coté gauche de l image
 
2ème case, largeur 100%, milieu de l image (largueur=1pxl) en fond de la cellule du tableau (ça répète le dégradé vertical en largeur autant de fois que necessaire pour remplir la largeur de la page)
 
3ère case, largeur fixe 200 pxl, coté droit de l image
 
Par dessus, un layer, largeur 100%, avec le texte du menu. Sauf: si tu mets le menu uniquement au milieu (largeure=entre 800-400 et 1024-400) tu peux le mettre dans la 2ème case du tableau.
 

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed