Changement de class ...

Discussion dans 'Web, design' créé par SkYlEsS, 31 Octobre 2006.

Statut de la discussion:
Fermée.
  1. Offline
    SkYlEsS Kawai
    Mon but : changer la class d'un élément lors du passage de la souris + un clic n'importe où sur cet élément = clic sur le lien que contient l'élément ...

    Code xHTML :
    Code:
    <table cellspacing="0" cellpadding="3" border="0">
    <tr><td class="menutitle">Forums</td></tr>
    <tr><td class="menusubtitle" onmouseover="switch_bg();" onmouseout="switch_bg();" onclick="tolink();"><a href="#">Gazette du Palais</a></td></tr>
    <tr><td class="menusubtitle" onmouseover="switch_bg();" onmouseout="switch_bg();" onclick="tolink();"><a href="#">Cafétéria du Palais</a></td></tr>
    </table>

    Code Javascript :
    Code:
    function switch_bg()
    {
    	this.ClassName = (this.ClassName == "menusubtitle") ? "menusubtitleover" : "menusubtitle";
    	hand_pointer(this);
    }
    
    function hand_pointer(Objet)
    {
    	try
    	{
    		Objet.style.cursor = "pointer";
    	}
    	catch()
    	{
    		Objet.style.cursor = "hand";
    	}
    }
    
    function tolink()
    {
    	Links = this.getElementsByTagName("a");
    	if (Links[0])
    	{
    		if (is_ie)
    		{
    			Links[0].click();
    			window.event.cancelBubble = true;
    		}
    		else
    		{
    			window.location = Links[0].href;
    		}
    	}
    }
    Mais rien ne fonctionne ... :[] Y a un truc qui m'échappe ... mais quoi ? :colere:
    SkYlEsS, 31 Octobre 2006
    #1
  2. Offline
    SkYlEsS Kawai
    Apparemment, personne ne voit où est le problème ... :pfrt:
    SkYlEsS, 1 Novembre 2006
    #2
  3. Offline
    Xou I ♥ rien
    Pour ce qui est programmation, sur ce forum, y'a plus souvent d'aide malheureusement.

    Moi le java, je suis une quille en plus :-(

    Je te suggère www.2037.biz, un forum qui devrait répondre à tes attentes.
    Y'a aussi www.developpez.com ;)
    Xou, 2 Novembre 2006
    #3
  4. Offline
    SkYlEsS Kawai
    Merci mais je préfère alors m'en sortir seul, comme d'hab' ;-D

    (Première fois que la communauté de GamerZ ne répond pas à mon appel ... :pfrt: )
    SkYlEsS, 2 Novembre 2006
    #4
  5. Offline
    BelZe *
    aKC1a répond souvent au topic sur le JS ou autre, envoie lui un PM ;)
    BelZe, 2 Novembre 2006
    #5
  6. Offline
    sebcbien Touriste
    Tu veux dire quoi par changement de classe quand tu passes sur un lien ? Sinon en xhtml tu peux faire : imaginons que ton lien est dans le bloc "navigation" tu vas dans la css et tu mets par exemple :

    #navigation a:hover {
    color: red;
    {
    Lorsque tu passeras avec la souris sur le lien, le lien sera coloré en rouge tu peux faire de meme avec a:visited -->il sera rouge quand tu auras cliqué dessus

    par contre pour le javascript faudrait que je regarde plus precisemment
    sebcbien, 2 Novembre 2006
    #6
  7. Offline
    SkYlEsS Kawai
    Oui, cela je le sais pertinemment :roll:

    - Je veux juste que lorsque je survole une balise <td>, celle-ci change de class ...
    - Lorsque je clique n'importe où sur une balise <td> = clic sur le lien contenu dans cette balise <td>.
    - Le dernier est censé me mettre une icône en "main" lors du survol d'une balise <td> pour pseudo-signaler qu'un clic sur cette balise équivaut à un clic sur le lien qu'elle contient.

    EDIT : Comme les menus de GamerZ tiens ... o_O (Aurais-je été influencé par mon subconscient ? :gne: )
    SkYlEsS, 2 Novembre 2006
    #7
  8. Offline
    aKC1a OldSchool CS Star
    Comme répondu en PM jvais y jeter un oeil c'est promis :)

    Zuste que la g une grosse bouze qui vient de me tomber dessus au boulot :p

    Ca arrive ca arrive :p
    aKC1a, 3 Novembre 2006
    #8
  9. Offline
    aKC1a OldSchool CS Star
    Voila :)
    je dois avouer que j'ai pas regardé a ton code des masses :)

    j'ai fait un truc j'espere que ca correspond a ce que tu cherchais, sinon hésite pas a redemander

    j'ai pris un css de merde de base pour tester, juste les couleur de fond des cellules qui changent mais ca ne changera rien pour toi :)

    Code:
    <style type="text/css">
    .menusubtitle { 
       background:red; 
    } 
    .menunormal {
       background:white;
    }
    </style>
    le truc c'est de definir une de tes classes comme etant la classe de l'etat initial.
    Ici, menunormal.

    Ensuite faire une fonction qui dit que si ta cellule a cette ID, il doit appliquer la class2

    Code:
    function classON(skyless) { 
    if(skyless.id=='td0') { 
    skyless.className = 'menusubtitle'} 
    return true; 
    } 
    
    Ensuite tu prévois une fonction "OFF", qui permettra, quand on sortira de la cellule, de la recolorer avec la classe de base.

    Code:
    function classOFF(skyless) { 
    skyless.className = 'menunormal'; 
    return true; 
    }
    Ensuite il te reste plus qu'a appeller tes <td> avec des IDs, ici "td0".
    et c'est reglé, en théorie :)

    Ce qui donne au final :

    Code:
    <head>
    <style type="text/css">
    .menusubtitle { 
       background:red; 
    } 
    .menunormal {
       background:white;
    }
    </style> 
    
    <script type="text/javascript"> 
    
    function classON(skyless) { 
    if(skyless.id=='td0') { 
    skyless.className = 'menusubtitle'} 
    return true; 
    } 
    
    function classOFF(skyless) { 
    skyless.className = 'menunormal'; 
    return true; 
    }
    
    </script>
    
    </head>
     
    <body> 
    
    <table cellspacing="0" cellpadding="3" border="0">
    <tr><td class="menutitle">Forums</td></tr>
    <tr><td id="td0" onmouseover="classON(this);" onmouseout="classOFF(this);" onclick="tolink(this);"><a href="#">Gazette du Palais</a></td></tr>
    <tr><td id="td0" onmouseover="classON(this);" onmouseout="classOFF(this);" onclick="tolink(this);"><a href="#">Cafétéria du Palais</a></td></tr>
    </table>

    De 1, j'espère que ca marche
    de 2, que c'est bien ca que tu voulais
    de 3, que ca t'aide, ou au pire que ca aide quelqu'un d'autre: )

    Dis moi quoi,
    aKC1a, 3 Novembre 2006
    #9
  10. Offline
    SkYlEsS Kawai
    Absolument ... pas ! :-(

    Tant pis, j'me débrouillerai :beuh:
    SkYlEsS, 3 Novembre 2006
    #10
  11. Offline
    aKC1a OldSchool CS Star
    Absolument pas . . .
    ca marche pas ou c'est pas ce que tu cherchais ?

    J'ai p-e mal compris dans la précipitation.

    Tu peux (re)donner un autre exemple concret ?
    aKC1a, 3 Novembre 2006
    #11
  12. Offline
    SkYlEsS Kawai
    'fonctionne pas ... :pfiou:

    j'trouverai ... :]
    SkYlEsS, 3 Novembre 2006
    #12
  13. Offline
    aKC1a OldSchool CS Star
    aKC1a, 4 Novembre 2006
    #13
  14. Offline
    SkYlEsS Kawai
    Le prob vient sans aucun doute du reste du code après plusieurs tests ... mais d'où ? :gne:
    SkYlEsS, 4 Novembre 2006
    #14
  15. Offline
    Xou I ♥ rien
    EDIT : effectivement, c'est juste pour l'affichage.

    Chez moi, ça fonctionne très bien aussi cette page. Donc le prob doti venir de ton navigateur ou ton client Java.
    Xou, 4 Novembre 2006
    #15
  16. Offline
    SkYlEsS Kawai
    Bouhouhouhou. :dead: :eek:
    SkYlEsS, 4 Novembre 2006
    #16
  17. Offline
    Xou I ♥ rien
    Bah fais ça en CSS, ça t'évitera de faire une dépression nerfeuse :-D
    Xou, 4 Novembre 2006
    #17
  18. Offline
    SkYlEsS Kawai
    Bon bah j'ai recommencer mes scripts et ça fonctionne maintenant ...

    Y a des choses qu'il faut renoncer à comprendre parfois ... surtout lorsqu'il s'agit de codes :proud:

    Encore un peu et on dirait les menus de GamerZ ... :D

    Merci tout d'même ;-D

    (Aller hop, j'm'attaque à la messagerie maintenant :oops: )
    SkYlEsS, 4 Novembre 2006
    #18
  19. Offline
    aKC1a OldSchool CS Star
    bon amusement :)
    aKC1a, 5 Novembre 2006
    #19
Statut de la discussion:
Fermée.