Votre question

en tete adaptable a toute résolution d'écran

Tags :
  • Programmation
  • Écrans
Dernière réponse : dans Programmation
3 Juillet 2008 19:31:40

Bonjour,

Voila je suis en train de créer mon site web mais le probleme je souhaiterais que mon en tete puisse s'adapter a toute les résolutions d'écran a partir de 1024*768. Je sais que c'est possible car le site de manga fullanime la fait sur le sien comme vous pouvez le voir sur ce lien: http://fullanimes.free.fr/animes-episodes-ddl.php?id_an....
La bande noir en haut s'adapte toujours quelqu'un aurait il une idée sur comment on doit faire?

Merci d'avance pour votre aide

Autres pages sur : tete adaptable resolution ecran

3 Juillet 2008 20:16:44

Une technique très simple :

une table avec deux cases et avec un border=0.
Dans la première case tu met ton image et tu fixe la taille de la case à celle de ton image.
Dans la deuxième tu met un fond et tu ne fixe pas la taille.

Ou sinon tu peux faire plus joli (sans avoir des bords) en utilisant les frames :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">
<HTML>
<HEAD>
<TITLE>page avec bando</TITLE>
</HEAD>

<FRAMESET style="position: fixed" ROWS="120,*" Frameborder="no">

<FRAME SCROLLING="no" NAME="barre" SRC="bande_haut.html">
<FRAME SCROLLING="yes" NAME="forum" SRC="page.html">

<NOFRAMES>
Votre navigateur ne reconnait pas les frames !
</NOFRAMES>

</FRAMESET>

</HTML>


Ou encore avec les iframes (je crois que c'est ce qu'ils ont fait, j'ai vite regardé, mais je crois)
3 Juillet 2008 20:22:26

ok merci je vais essayer sa je te tiens au courant.
Contenus similaires
3 Juillet 2008 20:39:50

Le probleme c'est que moi mon en tete c'est une image jpg que j'ai créer mais je sais pas ou je dois la mettre dans ton code pour la voir apparaitre.
4 Juillet 2008 01:56:22

En fait si tu regarde bien :

<FRAMESET style="position: fixed" ROWS="120,*" Frameborder="no">

ça définit deux parties dans la page, la première de 120px de haut, et la seconde fait le reste de la page.

<FRAME SCROLLING="no" NAME="barre" SRC="bande_haut.html">

affiche la page bande_haut.html dans la première partie de la page

<FRAME SCROLLING="yes" NAME="forum" SRC="page.html">

affiche la page page.html dans la seconde partie de la page

Donc pour toi il faut que tu créé ces deux fichier html et que tu mette ton image dans le premier.

Mais mon code était un exemple, tu n'est pas obligé de faire comme ça.
4 Juillet 2008 16:41:02

J'ai essayer mais je n'y arrive pas désolé tu connais pas un moyen plus simple stp? Je sais je suis chiant mais viens moi en aide la je bloque totalement
4 Juillet 2008 17:04:57

bin il y a avec les iframes, mais le principe est le même, il faut créer une page html.
Sinon prend la technique de la table.
4 Juillet 2008 17:11:48

j'ai essayer une solution pour que ma page soit toujours la meme sans avoir de barre de défilement c'est de mettre body {width:100%;} le seul probleme c'est que sa déforme grandement ma page. Par contre j'ai réfléchi a un moyen qui devrait marcher mais je sais pas comment faire:
avec une fonction
si résolution écran= 1024*768 alors mon image a une valeur width de 1024
si résoulution écran= 1280*960 alors mon image a une valeur width de 1280
etc...
qu'en pense tu?

Ou bien encore une autre solution je créer plusieurs fois la meme image a des dimensions différentes et je prend le meme principe que au dessus sauf que dans le alors je met image="nom de l'image qui correspond en fonction de la taille"

que dis tu de cela est possible?
4 Juillet 2008 17:49:33

Oui c'est possible aussi, et ça se fait facilement en javascript.
Parce que ton image elle ressemble à quoi ?
4 Juillet 2008 17:50:06

heu attend je te met sa en lien
4 Juillet 2008 17:53:09

voila c'est a sa que sa ressemble
4 Juillet 2008 20:32:50

pfiouuuuu, ça va être dur là.
Pour qu'une image puisse être adaptable, il faut qu'elle comporte une zone rectiligne, ce qui n'est pas ton cas.
Dans ton cas il est je pense préférable de garder la même image en 1024 de large et de la centrer dans ta page.
Tom's guide dans le monde
  • Allemagne
  • Italie
  • Irlande
  • Royaume Uni
  • Etats Unis
Suivre Tom's Guide
Inscrivez-vous à la Newsletter
  • ajouter à twitter
  • ajouter à facebook
  • ajouter un flux RSS