menu activé par un elem du contenu

Bonjour,

Je cherche a faire quelque chose d'un peu bizarre.

J'ai créé un menu maximenu vertical, a coté de ca j'ai ma page avec mon contenu.

J'aimerais que lors du passage de la souris sur un des éléments du contenu (une div ou une image) la ligne du menu correspondant passe en "survolé" (cad passe en colorisé).

J'ai commencé a chercher une solution avec la fonction onmouseover mais je ne sait pas quoi appeler.

Je voudrait appeler le menu en hover grace au onmouseover et le repasser en non actif avec le onmouseout.

Serait il possible d'avoir la direction a suivre. (Que dois je appeler, comment...)

Merci d'avance

J'ai réussi a trouver un début de réponse avec ce code

<script>
function ChangeColorRose(element)
{
element.style.background='#ab2166'
element.style.color='#FFFFFF'
}
function ChangeColorBlanc(element)
{
element.style.background='#ffffff'
element.style.color='#000000'
}
</script>

<div class="art-layout-cell layout-item-2"
onclick="window.location='index.php/diagnostic-medical'" onmouseover="ChangeColorRose(document.getElementsByClassName('item136')[0])" onmouseout="ChangeColorBlanc(document.getElementsByClassName('item136')[0])"
style="width: 34%; cursor: pointer;">


Cela permet de changer le background de l'élément du menu au passage de la souris sur la div du contenu.

En revanche, la couleur du texte ne fonctionne pas... et cela colorise la div en entiere.


PS: j'utilise le style Blank de maximenu

Des idées?? :whistle:

Ca avance ca avance!!

Alors la ca marche presque avec le code suivant:

<script>
var maclasse = ''

function ChangeColorRose(nom)
{
if (maclasse == '')
{
element = document.getElementsByClassName(nom)[0]
maclasse= element.className
element.className='level1' + ' ' + nom
}
}
function ChangeColorBlanc(nom)
{
if (maclasse != '')
{
element = document.getElementsByClassName(nom)[0]
element.className = maclasse
maclasse=''
}
}
</script>

<div class="art-layout-cell layout-item-2"
onclick="window.location='index.php/diagnostic-medical'"
onmouseover="ChangeColorRose('item136')"
onmouseout="ChangeColorBlanc('item136')"
style="width: 34%; cursor: pointer;">
</div>



Avec ce code cela marche presque au seul petit détail que je n'ai pas trouver comment appeler la classe item1:hover.

Des idées?? :silly:

salut
le plus simple est de faire ça en JS effectivement, mais il suffit d'ajouter une classe puis la retirer.Ensuite tu pilotes tous les styles en CSS (fond, couleur de text ...)
si tu as jQuery ou Mootools de chargé ça va être bien plus simple
tu es sous joomla 2.5 ou 3 ?
CEd

Bonjour et merci de ta réponse

Je suis sous Joomla 3.

Je ne connais pas JQuery ou Mootools je vais regarder ca de plus près.

J'ai regardé ca ce week end et j'ai trouvé un début de solution avec le code suivant:

LA mon menu passe en survolé au passage de la souris. Le seul soucis c'est que ca ne fait pas la meme chose que le survolé du menu. C'est difficile a expliquer donc je vais mettre des images!

La premiere image survol du menu corrspond a ce que j'obtient quand la souris survol le menu.

La seconde image survol de l'image est ce que j'obltient quand la souris survol l'image.



Merci de ton aide

avec joomla 3 tu peux utiliser jQuery et un code dans ce style et tu styles la classe "toto" en CSS pour obtenir ton rendu