11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

je débute depuis 4 mois dans l'intégration sous Symfony et Django. J'ai créé un menu grâce à jQuery.
Celui-ci fonctionne très bien à une condition près : le menu n'apparaît que quand on clique dessus. Alors que je souhaiterais le voir dès le chargement de la page.
J'ai à priori ciblé le problème de css : c'est l'image de fond dans la classe .menu_head qui ne se charge pas. Par contre si je mets une couleur de fond, elle est prise en compte !!!

Voici l'url pour y jeter un œil. Attention, pour le faire apparaître, cliquez en haut à gauche sur le fond blanc : http://wonderfu.wdfproject.fr/menu_equinoxe/index.html

Merci.

upload/24832-menuequino.png
Modifié par Wonderfoule (30 Aug 2010 - 09:30)
Administrateur
Bonjour et bienvenue, Smiley smile

ton script fait bien ce que tu dis de faire : au clic, charger les images de fond

a écrit :
$(document).ready(function()
{
$("#pane p.menu_head").click(function()
{
$(this).css({backgroundImage:"url(images/bg_menu_select.gif)"}).next("div.menu_body").slideDown(500).siblings("div.menu_body").slideUp("slow");
$(this).siblings().css({backgroundImage:"url(images/bg_menu.gif)"});
});
});


Si tu veux que ça se fasse au chargement et sans JS, c'est dans les CSS que ça se passe. Ou si tu tiens au JS (très mauvaise idée en terme d'accessibilité sans compter l'alerte que ça va poser pour googlebot de constater qu'un menu est invisible), n'utilise pas click mais
$(document).ready(function() { }
Merci Felipe,

en fait j'ai récupéré du code que j'ai ensuite adapté à mon design.

Je ne connais absolument rien -pour l'instant- au javascript et je suis sensible à l'accessibilité.

Peux-tu me dire comment je dois compléter la fonction $(document).ready(function() pour que cela fonctionne, car je pense être OK pour les css.

Merci
Je viens de découvrir l'excellent tuto sur les accordions dans Apprendre.
Je me plonge dedans, je sens que je vais trouver réponse à mes questions.