Pages web dynamique, aide [Résolu]

pinguin - Dernière réponse le 2 juin 2008 à 17:14

Bonjour à tous,
voila, je possède un site web et j'aimerais apporter quelques modifications.
Je vous explique la situation. Le nombre de pages web devenant trop importantes, j'aimerais refaire mon site web avec des parties fixes et une partie qui changent.
exemple : la partie 1 c'est la bannière donc elle est fixe. la partie 2 c'est les liens donc ca reste fixe aussi. Mais la partie
3 serais la partie avec le contenu de la page web.
Donc en d'autre mot il n'y a que la partie 3, qui contient l'info, qui change si je clique sur des liens différents.
je pense avoir entendu parler de frame, mais je ne suis pas certain.
Pour ce qui est de mon niveau, je connais l'html et le css à un niveau avancer.
Autre chose que je voulais savoir comment on appel le type de langage utiliser pour créer des sous menu au liens
(comme ici sur cette page de comment ça marche, en haut, si vous survoler le lien "astuces" il y a un sous menu qui apparait).
merci d'avance pour l'aider que vous pourrez m'apporter ;) ;)

Pages web dynamique, aide »

Suggestions

Pages web dynamique, aide
Créer un site beau, dynamique et respectueux des standards » Fiches pratiques
Les etape pour faire un site dynamique » Forum
Generateur de site web dynamique (Résolu) » Forum
Partage de répertoire ou page web dynamique (Résolu) » Forum
Signification de pages web dynamiques (Résolu) » Forum

Plus

Réponse

Brachior 616Messages postés 21 octobre 2007Date d'inscription 30 mai 2008 à 22:41

alr oui les frame st une solutions
mais elles ne st plu valide par le W3C
si tu as le tps le courage et la motivation .. vas voir du coté de l'ajax :)

sinon pr les frames va sur google et cherche un cours d'html 1.0 ( ca se trouve tres facilement ^^ )

apres pour ce qui est des menu deroulant c'est du javascript ^^ ( merveilleux langage ^^ )

ds l'exemple en question il suffit de faire un fct qui change le style d'un bloc ...

je m'explique ^^
imagine doit faire une liste de definition ... tu dis au css de cacher les dd ( soit display:none; )
ensuite tu fais une fct en javascript qui va changer ce style en style.display='block'
il te suffit alr de mettre dans ta balise dt un peu de js ( soit onmouseover='fonctionjs(id du dd) )
puis apres tu peux le refaire disparaitre avec un onmouseout ^^
apres vu que tu as dit bien conaitre le css ^^ je ne t'explique pas cmt faire pr que le bloc dd ne fasse pas bouger tte la page ^^

Ajouter un commentaire

Afficher les 24 commentaires

Brachior- 30 mai 2008 à 23:05

tu sais les liste de definition

la par exemple ca donnerait ca:

<dl>
  <dt onmouseover='devoile(menu1);' onmouseout='devoile();'>menu1</dt>
    <dd id='menu1'>
      elementmenu
      elementmenu
      elementmenu
    </dd>
</dl>

pinguin - 30 mai 2008 à 23:10

ah ok cool , mnt je vois ce que tu veux dire ;) merci beaucoup pour l'aide ;)

Brachior- 30 mai 2008 à 23:25

de rien ^^
au fait le principal probleme des frames ... c'est google ^^
c'que j'veux dire c'est que ton site ne pourra pas etre referencé normalement ^^
etant donné que tu n'as qu'une page et qu'il n'y a aucune possibilité pr qqun d'exterieur d'accéder a une page autre que l'index ^^

pinguin - 30 mai 2008 à 23:27

arf ok :/ chui dans la mer*** alors, ya quoi comme solutions alternatives pour ce problème ( pour garder le référencement google et le style de structure de site que j'ai évoquer) ??

Brachior- 30 mai 2008 à 23:39

y a les include php Oo

tu fais un entete.php où deds tu colles ton div:entete , ton div:menu
puis sur tte tes pages tu fais un <?php include('entete.php'); ?>

tu peux faire pareil avec un pied de page

attention tt d'meme .. moi en general je divise en 2 l'entete ( le 1er qui s'arrete juste avant la fermeture du head et le 2eme qui va jusqu'au div:corps ) prck c'est plus propre ( et validé ;) ) de mettre les script ds le head ^^

pinguin - 31 mai 2008 à 10:52

ok, merci bcp pour les précisions. Je vais tjrs m'attaquer aux sous-menus, puis après je verrais bien pour diviser les pages.

en faite mon envie de diviser les pages vient du faite que de temps en temps je rajoute des rubriques, donc cela veut dire rajouter des liens dans les menus et modifier toutes les menus de chaques pages, même en utilisant les copier/coller c'est ch**** car j'ai casi 20 à 30 pages ...

Brachior- 31 mai 2008 à 10:54

je comprends lol ^^
dc les includes st fait pr toi ;)

pinguin - 31 mai 2008 à 11:42

j'ai essayer pour les liens avec le code que tu m'as donner, mais je ne sais pas pourquoi, mais il reste toujours visible, c'est pas seulement quand je passe la souris au dessus :s . tu saurais m'aider un peut plus ?

Brachior- 31 mai 2008 à 11:54

hum .. je peux te donner un exemple de code si tu veux ^^

<script type='text/javascript'>
  <!--
    window.onload=devoile;
    function devoile(id){ //on prends comme argument l'ID de l'objet
      var d=document.getElementById(id);  // on le rentre ds une variable pr simplifier l'ecriture
      for(var i=1;i<=2;i++){  //on fait une boucle pr eviter de reécrire autant de fois qu'il existe de menu deroulant
        if(document.getElementById('menu'+i)){ // alors on cache
          document.getElementById('menu'+i).style.display='none';}}
      if(d){  // alors on devoile
        d.style.display='block';}}
  -->
</script>

pinguin - 31 mai 2008 à 12:00

oula ça se complique ...

ce script est à ajouter dans la partie <head> ??

Brachior- 31 mai 2008 à 12:04

ouaip ;)
comme tt bn script qui se respect :) ^^

ensuite le 'menu'+i est une concatenation ^^
il te suffit alrs de reprendre la syntaxe que je t'ai donnée plus haut ^^

pinguin - 31 mai 2008 à 12:17

Ca ne marche toujours pas :/

j'ai recopie exactement ton code java, sans rien changer dedans !!
et voici un extrait du code à l'endroit des menus:

<li><a href="page0.html">page0</a></li>
<dt><onmouseover='devoile(menu1);' onmouseout='devoile();'>menu1</a></dt>
                    <dd id='menu-elecdie'>
                          <a href="page1.html">page1</a>
                          <a href="page2.html">page2</a>
                     </dd>
<li><a href="page3.html">page3</a></li>

est-ce que tu vois qqch qui n'irais pas ??

pinguin - 31 mai 2008 à 12:19

correction du code :

<li><a href="page0.html">page0</a></li>
<dt><onmouseover='devoile(menu1);' onmouseout='devoile();'>menu1</a></dt>
                    <dd id='menu1'>
                          <a href="page1.html">page1</a>
                          <a href="page2.html">page2</a>
                     </dd>
<li><a href="page3.html">page3</a></li>

Brachior- 31 mai 2008 à 12:28

pour une validation dans les regles penses a entourer ton dt dd par les balise <dl></dl> ^^
ensuite l'erreur est ici ^^ :

<dt><onmouseover='devoile(menu1);' onmouseout='devoile();'>menu1</a></dt>

c'est :

<dt onmouseover="devoile('menu1');" onmouseout='devoile();'>menu1</a></dt>

pinguin - 31 mai 2008 à 12:37

voici le code exacte, qui ne fonctionne tjrs pas, je désespère ....

<li><a href="recti.html">Rectification</a></li>
				<dl>
                	<dt onmouseover="devoile('menu-elecdie');" onmouseout='devoile();'>Electricité-diesel</dt>
                        <dd id='menu-elecdie'>
                              <a href="elec.html">électricité</a>
                              <a href="diesel.html">diesel</a>
                         </dd>
                </dl>
				<li><a href="electro.html">Electronique</a></li>

Brachior- 31 mai 2008 à 12:59

lol ^^ dsl oui c'est normal que ca ne fct pas ^^
en fait mon script permet de créer autant de menu deroulant que tu le souhaites ^^
et ca grace a la variable i ^^
et 'menu'+i donne 'menu1' puis 'menu2' etc etc ^^
dc soit tu veux faire un seul menu deroulant et alr il te suffit de modifier le script ainsi :

<script type='text/javascript'>
  <!--
    window.onload=devoile;
    function devoile(id){
      var d=document.getElementById(id);
      if(d){
        d.style.display='block';}
      else{
        document.getElementById('menu-elecdie').style.display='none';}}
  -->
</script>

soit tu en veux plusieur et alr il faudra les nommer 'un_nom_pr_ts'+un_nb
exemple menu1 menu2 ...

pinguin - 31 mai 2008 à 13:19

ok, cool ca marche super bien ;) ;) merci merci bcp

reste une petit prob : quand le sous-menu apparait et que je déplace ma souris pour cliquer sur un des 2 liens, le sous-menu disparait et je ne sais pas cliquer sur mes liens.

t'as une idée ,

Brachior- 31 mai 2008 à 13:22

oui oui dsl ^^
j'avais oublié ca xD

il suffit de rajouter ds le dd les memes appels de fonction que ds le dt :

<li><a href="recti.html">Rectification</a></li>
  <dl>
    <dt onmouseover="javascript:devoile('menu-elecdie');" onmouseout='javascript:devoile();'>Electricité-diesel</dt>
      <dd id='menu-elecdie' onmouseover="javascript:devoile('menu-elecdie');" onmouseout='javascript:devoile();'>
        <a href="elec.html">électricité</a>
        <a href="diesel.html">diesel</a>
      </dd>
  </dl>
<li><a href="electro.html">Electronique</a></li>

pinguin › pinguin - 31 mai 2008 à 13:22

autre problème, comme c'est un menu vertical, les sous-menu doivent s'afficher sur la droite et quand ils s'affichent, la colonne des menus s'élargi ... bizard bizard

Brachior- 31 mai 2008 à 13:24

alr la c'est un probleme de css :)
mets le dd en position:absolute;
et déplace le comme bn te semble ;)

pinguin - 31 mai 2008 à 13:29

merci bien pour toute ton aide, problème résolu. reste juste quelque finition.

dernière petite question, si je dois faire un autre sous menu sur la même page, je dois créer un autre script java dans la partie <head> je suppose ??

Brachior- 31 mai 2008 à 13:57

non tu as juste a rajouter

document.getElementById('id_de_l'autre_menu').style.display='none';

dans le else
enfin je suppose ^^ j'ai pas testé ^^
mais sinon tu reprends le 1er script que je t'ai donné et tu renommes tes menus en menu1 menu2 etc ...

pinguin - 2 juin 2008 à 17:14

Salut,

je viens de remarquer un prob : avec firefox, quand le sous-menu apparait, la colonne ne s'élargit pas, alors que sous internet explorer, elle s'élargit. ya moyen d'arranger ca ???

Répondre au sujet

Posez votre question

Dossier à la une

Passage au tout numérique : quel coût pour les particuliers ?

Passage au tout numérique : quel coût pour les particuliers ?

Combien cela coûte-t-il au total ? Quelles aides apportent l'état et les acteurs du marché pour alléger cette charge non choisie ? Tous les détails sur Commentçamarche.net.

Pages web dynamique, aide [Résolu]

Pages web dynamique, aide »

Passage au tout numérique : quel coût pour les particuliers ?