Equivalent du 'frameset' en CSS

HTML5, CSS3, Javascript, support des mobiles... Que penser de votre site ? Vous manquez d'informations pour la construction d'un site qui puisse s'afficher correctement partout ? C'est un problème simple, un peu complexe ? Venez ici !
alain47
Arias
Messages : 18
Inscription : 03 mars 2007, 11:42

Equivalent du 'frameset' en CSS

Message par alain47 »

Bonjour,

Je cherche à reproduire un 'frameset' en CSS.

Je sais le faire avec peu de texte à afficher mais lorsqu'il y a l'équivalent de 10 pages HTML par exemple, est ce possible ?

Je m'explique : j'ai mis les 12 liens de ma page principale en haut de page. (au préalable, j'ai divisé cette page en 3 DIV : header (10 % de la hauteur de la page), content (90 % de la hauteur) et enfin footer (pour le copyright en bas de page).
Le menu est dans le header. L'affichage est dans le content.

Ce que je souhaite : lorsqu'on clique sur un lien (en haut), il faudrait que le texte s'affiche en bas (dans le "content").

Je l'ai fait avec le CSS et le DOM en utilisant "visibility" => "hidden" et "visible" en fonction du click (avec un peu de javascript sur le lien et get
ElementById) et ca marche très bien.

Mais il faut que le texte à afficher se trouve déjà sur la page principale (et non pas à l'exterieur de la page comme cela serait possible avec l'ancien systeme des frames et frameset ; avec l'ancien systeme, j'aurai eu un frame en haut pour le menu et un frame en bas pour afficher chacune des 10 pages en fonction du choix cliqué).

Donc si je veux le texte de 10 liens donc de 10 pages html, je dois tout mettre sur ma page principale et je vais me retrouver avec une page principale aussi lourde que 10 pages html !

Bien sur, je ne veux pas qu'il y ait un effet de "reload" (il n'y en a pas du tout avec "hidden" et "getElementById" qui permettent une parfaite fluidité d'affichage ).

Je crois savoir (d'apres ce que j'ai lu dans les revues d'informatique) que c'est possible avec AJAX (et "HTTPrequest" je crois) mais je ne connais pas du tout cette pratique.
J'ai un peu lu dessus, mais il faut me semble t il une API coté serveur .. donc je prefere attendre pour l'instant, avant d'utiliser cette pratique.

Quelqu'un a-t-il une solution ?


(NB : j'ai XP avec FF 2.0 et IE).


Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.2) Gecko/20070219 Firefox/2.0.0.2
alain.
Benoit
Administrateur
Messages : 4894
Inscription : 19 juil. 2003, 10:59

Message par Benoit »

Il ne faut pas vraiment d'API côté serveur, en fait tu peux simplement appeler un fichier texte qui reprend le contenu de ta page.

Bon, évidemment il faut encore gérer le cas des visiteurs qui n'ont pas JavaScript et/ou XMLHttpRequest, mais c'est assez trivial aussi. Côté serveur du moins :)
♫ Li tens s'en veit, je n'ai riens fais ;
Li tens revient, je ne fais riens. ♪
Fabrice.Tres.Net
Tyrannosaurus Rex
Messages : 2390
Inscription : 26 juin 2006, 12:50

Message par Fabrice.Tres.Net »

Je vois bien le caractèe pédagogique de ton execice. Mais y-a-t'il une autre finalité?
PS: Dans le cas des frames, les pages sont téléchargées puis affichées dans la frame correspondante au fil de la navigation. Donc il y a une interaction avec le serveur web.
alain47
Arias
Messages : 18
Inscription : 03 mars 2007, 11:42

Message par alain47 »

Merci à benoit. Dans un 1er temps, je vais me contenter de faire sans AJAX :-) Ca m'interesserait beaucoup, mais je n'ai pas vraimment le temps de me consacrer aux recherches pour l'instant.

On ce qui concerne la finalité de mon choix : c'est pour l'intégrer dans mon site perso (sur a ville) et en meme temps pour essayer de progresser en CSS. Il y a quelques temps, un internaute de ce forum m'a fait remarquer qu'on ne pratiquait plus les TABLE, grace au CSS.

Sur le moment, j'ai été un peu étonné à vrai dire, car si effectivement on peut faire beaucoup de choses avec CSS, c'est aussi beaucoup plus compliqué car il faut etre tres minutieux. Tu oublies un width ou tu le places mal, et l'affichage de ta page est completement faussé sans que tu saches pourqoi. Alors que les TABLE sont enormément plus faciles à gérer ! (meme si tu es plus limité sur les differentes possibilités de création).

Mais comme je suis plutot curieux et que j'adore l'informatique, je m'y suis mis. Je connaissais le principe de fonctionnement du CSS mais nullement la totalité des differentes instructions.

J'ai donc modifié mon site (adresse de mon site à voir dans mon profil). J'ai ete chercher à droite et à gauche notamment sur les liens indiqués surle présent forum (et aussi sur le site d'une enseignante que j'ai trouvé pas mal, à savoir mamouthland, qu'elle en soit ici remerciée).

Apres avoir modifié la page de garde de mon site, je me suis retrouvé avec un MENU en haut de page, et ensuite une grande partie vide en bas.
J'ai donc pensé à utilisé les FRAMES comme je le faisais depuis plusieurs années , et puis je me suis dis que quitte à se lancer dans le CSS , autant le faire complétement :)

Sur mon site, au niveau du MENU, il y a 12 choix environs (12 liens). Le lien HISTOIRE fonctionne avec "getElementByID" et donc l'affichage reste sur ma page principale. Par contre tous les autres liens, dirigent sur une autre page HTML.

Ce que je voudrai, c'est rester sur ma page principale (comme avec HISTOIRE) et cela sans utiliser les FRAMES ... si c'est possible.

Je ne sais pas si on peut faire l'équivalent des INCLUDES , pour importer des fichiers textes sur la page principale, pour qu ils soient mis en page par CSS sur ma page principale.

Bien sur , si ce n'est pas possible, j utiliserai les FRAMES (que je trouve très bien ; on critique beaucoup les anciennes instructions de programmation, mais il faut avouer qu'elles etaient vraimment tres simples à maitriser . Ca doit etre la democratisation du XML il y a une 10zaine ou 15aine années, qui a fait ce revirement en ce qui concerne la separation de l'affichage et du contenu, dans la création des sites WEB persos).

Et voila.
Si quelqu'un peut m'aiguiller dans mes recherches.
D'avance merci.

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.2) Gecko/20070219 Firefox/2.0.0.2
alain.
Répondre

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 1 invité