Aller au contenu
  • Pas encore inscrit ?

    Pourquoi ne pas vous inscrire ? C'est simple, rapide et gratuit.
    Pour en savoir plus, lisez Les avantages de l'inscription... et la Charte de Zébulon.
    De plus, les messages que vous postez en tant qu'invité restent invisibles tant qu'un modérateur ne les a pas validés. Inscrivez-vous, ce sera un gain de temps pour tout le monde, vous, les helpeurs et les modérateurs ! :wink:

Messages recommandés

Posté(e) (modifié)

Salut,

Ma page HTML est validé :P :P :P , mais je ne peux pas mettre le lien comme quoi il est valide pour le W3C, car comme mon hébergeur me rajoute la partie <!-- DEBUT / Cybermonitor / START --> [..] <!-- FIN / Cybermonitor / END --> et qu'elle est pleine de fautes de script il ne la valide pas à la fin dommage!!! :P :P :P:):P . Je suis vraiment déçu pour ça ...

Le CSS aussi est validé :P :P .

 

Donc, maintenant je vais appliquer la même structure autres pages, rajouter des définitions au fur et à mesure et peut-être changer les couleurs, l'image de fond (enfin, le graphisme) par la suite.

 

Voila, je crois que je vais pouvoir mettre résolu pour ce topic si personne n'a rien à redire sur mon site.

Dans tous les cas, je remercie toutes les personnes qui m'ont aidé. :) :) :)

 

a+

Modifié par saladin

  • Modérateurs
Posté(e)

Attention, Saladin, pas trop vite...

 

Il me semble que, un peu par erreur je l'avoue, j'ai lancé hier soir ta page sous IE, et que le menu déroulant des Définitions ne se déroulait pas ? C'est à se demander s'il ne va pas falloir revenir sur les clauses CSS de #chmenu... :P

 

A croire qu'on reboucle sur le début de ton topic... :P

 

Fais une petite vérif avant de clore le débat.

Posté(e) (modifié)

Oui en effet il ne marche toujours pas ... Pourquoi les navigateurs ne peuvent pas avoir les mêmes normes entre eux? Rhalala ...

Bon, moi je ne vois pas de fautes Le validateur CSS n'ont plus, alors, qu'est ce qui ne va pas ?

Et sinon, je suis en train de faire les autres pages et sur la page "rubrique définition" ma <div> pied se place mal, malgré le code suivant dans le <head>:

 <style type="text/css">#pages {height: 560px;}</style>

et ne prend toujours pas toute la largeur.

bon ba j'vais regarder ce qui ne va pas pour IE .

Modifié par saladin
  • Modérateurs
Posté(e)

Salut Saladin !

 

Voilà, j'ai retrouvé. C'est IE qui a des faiblesses (petite biche, va) avec la pseudo-classe :hover. :P

 

Va voir, chez pompage.net, l'article La vengeance des menus déroulants (de Patrick Griffiths et Dan Webb), qui t'explique tout. Tu trouveras le petit script à inclure pour que IE sache se débrouiller par un autre biais (la classe sfHover construite pour l'occasion).

 

Heureusement que tu ne mets en oeuvre que des menus déroulants à un niveau, parce que les choses ont l'air de drôlement se sophistiquer pour un nombre de niveaux supérieur. Passionnants, les articles de pompage.net ! :P

 

Je vais ausi jeter un oeil sur ta page "rubrique définition" :P

Posté(e) (modifié)

Salut,

Merci d'avoir trouver le problème.

Le petit script en question, où faut-il le placer? Car moi je l'ai placé dans le CSS puisqu'il y avait les signes {}, mais même en le mettant et en changeant les pseudos classes :hover en :sfhover ça ne marche pas: c'est sans aucun doute moi qui est fait une connerie, mais, je ne vois pas laquelle.

 

En effet, ça à l'air plus compliqué pour les deux ou trois niveaux.

 

Merci d'avance pour ton coup d'oeil sur ma page en défaillance.

Modifié par saladin
  • Modérateurs
Posté(e)

En fait, ce n'est ni du HTML ni du CSS, il s'agit d'un script JavaScript. Tu l'insères dans le header :

 

<script type="text/javascript">
sfHover = function() {
var sfEls = document.getElementById("nav").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
	sfEls[i].onmouseover=function() {
		this.className+=" sfhover";
	}
	sfEls[i].onmouseout=function() {
		this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
	}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
</script>

ou tu en fais un fichier JavaScript externe, que tu nommes par exemple jssfhover.js et que tu références dans le header

 

<script type="text/javascript" src="jssfhover.js"></script>

Attention, sur la seconde ligne du script,

- il faut remplacer "nav" par "menu" (ton id à toi),

- il faudra peut-être remplacer "LI" par "li" (balise en majuscules en HTML, en minuscules en XHTML).

  • Modérateurs
Posté(e)

Bonjour Saladin !

 

Effectivement, ce script doit comporter un petit bug que je n'arrive pas à déceler...

Sur le même principe, de jouer sur l'attribut display de la liste <ul> "menu" au survol par la souris, voici un autre petit script qui, lui, fonctionne comme attendu.

 

function hover(obj){
 if(document.all){
   UL = obj.getElementsByTagName('ul');
   if(UL.length > 0){
     sousMenu = UL[0].style;
     if(sousMenu.display == 'none' || sousMenu.display == ''){
       sousMenu.display = 'block';
     }else{
       sousMenu.display = 'none';
     }
   }
 }
}
function setHover(id){
 LI = document.getElementById(id).getElementsByTagName('li');
 nLI = LI.length;
 for(i=0; i < nLI; i++){
   LI[i].onmouseover = function(){
     hover(this);
   }
   LI[i].onmouseout = function(){
     hover(this);
   }
 }
}

Fais-en un copier/coller dans un fichier texte que tu nommeras "MenuDeroulant.js", et que tu installeras au même endroit de l'arborescence que tes pages HTML. Il suffit ensuite de le référencer dans le header, et de le lancer au chargement de la page HTML (événement onload dans la balise <body>). Il faudra faire ces deux ajouts dans chacune de tes pages.

 

<head>

...

<script type="text/javascript" src="MenuDeroulant.js"></script>

</head>

<body onload="setHover('menu');">

...

Celui-là, je peux t'assurer qu'il fonctionne, je l'ai testé sur ta page index.html ! Et nous pouvons tous deux en remercier Greywolf qui, tombé récemment sur le même problème avec IE6, avait découvert cette solution, qu'il m'a aimablement signalée tout à l'heure :P

Posté(e)

Salut,

Tout d'abord merci à Greywolf et à toi pour votre aide car mon problème principal est réglé. :P

Je viens d'appliquer la solution à index.html et je vais le faire pour les autres pages.

Sinon, toujours pas d'idées pour le problème de la <div> pied sur la page rubriques définitions?

a+

  • Modérateurs
Posté(e)

Bonsoir Saladin !

 

A force de scruter les sources de index.html et definition.html façon jeu des 7 différences, je me suis dit que le problème n'émanait pas de la <div> pied elle-même, puisque tu l'avais manifestement copiée/collée d'une page à l'autre... et j'ai cherché ailleurs.

 

Euréka... figure-toi que tu as tout simplement fait sauter la fermeture de ta <div> pages, de sorte que la <div> pied est incluse dedans. Et #pages possède des marges latérales de 40px...

 

CQFD. Note bien que, si tu avais passé ta page definition.html au validateur, tu aurais récupéré une erreur qui t'aurait probablement rapidement guidé vers la solution (remarque, je dis ça, moi, mais je n'y ai pas pensé non plus). D'où l'utilité du validateur ! :P

 

positionimagetr0.gif

P.S.: symétrie verticale ? horizontale ? :P En tout cas, autour d'un axe vertical, bien sûr...

Rejoindre la conversation

Vous pouvez publier maintenant et vous inscrire plus tard. Si vous avez un compte, connectez-vous maintenant pour publier avec votre compte.
Remarque : votre message nécessitera l’approbation d’un modérateur avant de pouvoir être visible.

Invité
Répondre à ce sujet…

×   Collé en tant que texte enrichi.   Coller en tant que texte brut à la place

  Seulement 75 émoticônes maximum sont autorisées.

×   Votre lien a été automatiquement intégré.   Afficher plutôt comme un lien

×   Votre contenu précédent a été rétabli.   Vider l’éditeur

×   Vous ne pouvez pas directement coller des images. Envoyez-les depuis votre ordinateur ou insérez-les depuis une URL.

  • En ligne récemment   0 membre est en ligne

    • Aucun utilisateur enregistré regarde cette page.
×
×
  • Créer...