CSS - Afficher/masquer des "calques"

CSS - Afficher/masquer des "calques" - HTML/CSS - Programmation

Marsh Posté le 17-02-2005 à 18:48:18    

Je suis en train de mettre à jour un site, que je voudrais optimiser en incluant notamment le CSS.
Si j'ai bien tout compris, il serait alors possible sur l'exemple ci dessous (cf lien) de ne charger qu'une seule fois la barre de menu du haut, ainsi que le disque et le carré Google. Par contre, le sous-menu se chargerait lui sur chaque page.
 
http://bepimaco.free.fr/test/essai3
 
Est-ce que vous pensez que c'est faisable, ou vaut mieux abandonner l'idée ?
 
Merci


Message édité par bepimaco le 20-02-2005 à 23:19:50
Reply

Marsh Posté le 17-02-2005 à 18:48:18   

Reply

Marsh Posté le 17-02-2005 à 19:00:18    

ne pas confondre les CSS et les frames.
les CSS permettent de ne télécharger qu'une seule fois les description d'affichage des éléments. Ca ne permet pas de garder en mémoire une partie d'une page web pour la mélanger à une autre.
 
Les frames permettent de découper la zone d'affichage du navigateur en plusieurs parties qui corespondent alors à plusieurs page web. Il est donc possible de changer le contenu d'une de ces sous parties sans avoir de télécharger toutes les autres. Ca corespond déjà d'avantage à ce que tu décrit. ;)
 
Quand aux images qui ne seraient téléchargé qu'une seule fois, ca n'a rien à voir avec les frames ou les CSS, c'est le cache du navigateur qui entre en jeux. Le navigateur garde dans son cache un certain nombre de fichier dont des images qu'il n'a donc pas besoin de télécharger à nouveau pour les afficher dans une autre page.

Reply

Marsh Posté le 17-02-2005 à 19:23:58    

Je saisie mieux. En fait, faire du CSS, c'est simplement mettre en facteur toutes les infos dans une feuille à part.
 
Et est-ce que cette page, que j'ai faite avec des tableaux de tableauc de .... peux se faire en CSS (plus claire en CSS ?)
 
EDIT : Concrètement, même si je n'utilise pas les frames, est-ce que si la barre de menu est la même sur chaque page, elle ne va pas rester en mémoire au lieu de se re-charger sur chaque page ?


Message édité par bepimaco le 17-02-2005 à 19:25:20
Reply

Marsh Posté le 17-02-2005 à 19:34:54    

Si tu n'utilises pas de frame, le menu sera rechargé à chaque page. S'ils ne l'étaient pas, le navigateur n'afficherait pas de menu. (un navigateur, c'est pas super intéligent à la base, ca se contente d'afficher ce qu'on lui dit d'afficher et de la maniére de l'afficher)
Par contre, les images du menu ne le sera pas (merci mister "cache" ) et c'est idem pour les infos d'affichage contenu dans le css.

Reply

Marsh Posté le 17-02-2005 à 21:27:56    

bepimaco a écrit :

Je saisie mieux. En fait, faire du CSS, c'est simplement mettre en facteur toutes les infos dans une feuille à part.


Utiliser les CSS, c'est séparer le contenu (l'information que tu veux transmettre) du contenant (la manière dont cette information s'affiche).
 
Utiliser les CSS permet de diminuer la taille du code HTML et de passer le style (la manière dont le HTML est affiché) dans le cache de ton navigateur, permettant des chargements moins longs/plus efficaces, des sites au code plus clairs et la possibilité de construire des codes HTMLs logiques (construits sémantiquement et lisibles directement du code/en mode texte)
 

Citation :

EDIT : Concrètement, même si je n'utilise pas les frames, est-ce que si la barre de menu est la même sur chaque page, elle ne va pas rester en mémoire au lieu de se re-charger sur chaque page ?


Non, mais une barre de menu habituellement c'est quelques dizaines d'octets dans un fichier HTML bien conçu, avec toute la complexité séparée (dans le CSS), donc ce n'est pas un problème.

Citation :

Et est-ce que cette page, que j'ai faite avec des tableaux de tableauc de .... peux se faire en CSS (plus claire en CSS ?)


Oui il serait possible de faire quelque chose de ressemblant (pas nécessairement identique, mais probalement très proche) avec les CSS, en se payant le luxe de faire une page moins lourde (50ko ça fait vraiment beaucoup pour une page aussi légère)


Message édité par masklinn le 17-02-2005 à 21:28:27

---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
Reply

Marsh Posté le 19-02-2005 à 18:15:59    

Est-ce que les CSS sont bien  reconnus par les navigateurs ?
Sur la page que j'ai faite, les DIV sont en position:absolute mais selon IE ou firefoc ils n'apparaissent pas au même endroit !
 
Est-ce une mauvaise programmation de ma part, ou un problème lié au CSS ?

Reply

Marsh Posté le 19-02-2005 à 19:46:01    

Sur cette page :
http://bepimaco.free.fr/test/essai4
comme il s'agit d'un menu identique sur chaque page du site, ets-il possible de le gérer entièrement dans une feuille CSS ?
 
Par exemple pour la barre du haut, de mettre l'image de fon dasn un bloc, et de mettre par dessus d'autres blocs représentant les différents boutons ?
 
Merci de votre aide,
Bepimaco

Reply

Marsh Posté le 20-02-2005 à 10:04:34    

Reply

Marsh Posté le 20-02-2005 à 11:35:17    

bepimaco a écrit :

Est-ce que les CSS sont bien  reconnus par les navigateurs ?
Sur la page que j'ai faite, les DIV sont en position:absolute mais selon IE ou firefoc ils n'apparaissent pas au même endroit !
 
Est-ce une mauvaise programmation de ma part, ou un problème lié au CSS ?


Les marges par défaut des navigateurs, la pluspart du temps [:spamafote]  

bepimaco a écrit :

Sur cette page :
http://bepimaco.free.fr/test/essai4
comme il s'agit d'un menu identique sur chaque page du site, ets-il possible de le gérer entièrement dans une feuille CSS ?


très probablement [:spamafote]  
 


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
Reply

Marsh Posté le 20-02-2005 à 11:55:28    

S'il s'agit de marge "par défaut", il est donc possible d'indiquer des marges que le navigateur prendra en compte ?

Reply

Marsh Posté le 20-02-2005 à 11:55:28   

Reply

Marsh Posté le 20-02-2005 à 17:57:35    

Merci pour votre aide, j'ai réussi à faire quelque chose comme ça : http://bepimaco.free.fr/test/essai9.htm
 
Là où je bloque, c'est pour afficher et masquer des calques !
 
Je voudrais qu'en survolant les boutons, du texte s'affiche dans le cadre gris (une sorte d'écran). Avec les tableaux, je savais faire (http://bepimaco.free.fr/test/essai4) mais avec les CSS, je bloque.
 
Merci pour votre aide


Message édité par bepimaco le 20-02-2005 à 23:18:48
Reply

Marsh Posté le 20-02-2005 à 23:25:34    

up

Reply

Marsh Posté le 21-02-2005 à 09:57:08    

Y'a un tutorial de Masklinn sur les rollover à distance :)

Reply

Marsh Posté le 21-02-2005 à 10:07:11    

bepimaco a écrit :

Merci pour votre aide, j'ai réussi à faire quelque chose comme ça : http://bepimaco.free.fr/test/essai9.htm
 
Là où je bloque, c'est pour afficher et masquer des calques !
 
Je voudrais qu'en survolant les boutons, du texte s'affiche dans le cadre gris (une sorte d'écran). Avec les tableaux, je savais faire (http://bepimaco.free.fr/test/essai4) mais avec les CSS, je bloque.
 
Merci pour votre aide


 
Non, tu ne savais pas faire. Si tu avais su faire, tu comprendrais immédiatement qu'avec un simple div, c'est encore plus simple. Utiliser des scripts tout faits @dreamweaver, j'appelle pas ça "savoir faire".  :o  
 
Sinon pour répondre à ta question :
 
Faire apparaitre un div : document.getElementById('id_du_div').style.display = "block";
 
Le faire disparaitre : pareil, mais "none" à la place de "block".


---------------
Expert en expertises
Reply

Marsh Posté le 21-02-2005 à 10:24:53    

Ouais mais là c'est faisable en CSS-only :)

Reply

Marsh Posté le 22-02-2005 à 09:37:25    

Merci, ça marche(enfin j'espère que j'ai su retraduire !)  
 
J'ai encore quelques petits problèmes que je n'arrive pas à résoudre :  
 
- les textes sont soulignés et le text-decoration: none; ne marche pas avec IE  
- dans le menu, je n'arrive pas à centrer verticalement le texte au milieu du bouton  
- je voudrais que le menu reste ouvert lorsqu'on est dans les pages de ce menu
 
 
Encore merci pour votre aide,
 
Bepimaco

Reply

Sujets relatifs:

Leave a Replay

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