rollover annulation / restoration
Hello,
question un peu tricky sur une méthode pour faire quelque chose d assez simple sur le papier mais que je galère a intégrer
(AJAX/mootools/PHP inside)
voila , je dois intégrer une charte graphique un peu pointue pour un site avec arrondis et dégradé a gogo.
Sur les pages, j ai des sous menus qui chargent des pages en ajax
chaque élément de sous menu est un div avec une partie gauche (arrondi graphique, une partie centrale : couleur de fond et lien) , et une partie droite (arrondi graphique)
le tout contient biensur un joyeux rollover qui change les classes CSS des trois parties on the fly.
je simplifie volontairement mon code, je cherche une piste car qq chose m échappe dans le methodologie
Code:
1
2
3
4
5
6
|
<div id="menu_block_1" onmouseover="javascript:MakeCornerOver('monelement');" onmouseout="javascript:MakeCornerOut('monelement');" class="menu_block">
<div class="cornerleftpro" id="left_monelement"></div>
<div class="center_menu" id="menu_c_monelement"><a href="javascript:ShowProfile('monelement')" id="menu_link_{$ajax_link}">Mon lien</a></div>
<div class="cornerrightpro" id="right_monelement"></div>
</div> |
le js
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
|
function MakeCornerOver(id) {
$('left_' + id ).className='cornerleftpro_over';
$('right_' + id ).className='cornerrightpro_over';
$('menu_c_' + id).className='center_menu_over';
}
function MakeCornerOut(id) {
$('left_' + id ).className='cornerleftpro';
$('right_' + id ).className='cornerrightpro';
$('menu_c_' + id).className = 'center_menu';
}
function SetActivePage(id) {
$('left_' + id).className = 'cornerleftpro_active';
$('right_' + id).className = 'cornerrightpro_active';
$('menu_c_' + id).className = 'center_menu_active';
$('menu_block_' + id).onmouseover = null;
$('menu_block_' + id).onmouseout = null;
$('menu_link_' + id).href = 'javascript:;';
}
function UnSetActivePage(id) {
$('left_' + id).className = 'cornerleftpro';
$('right_' + id).className = 'cornerrightpro';
$('menu_c_' + id).className = 'center_menu';
$('menu_block_' + id).onmouseover = ????
$('menu_block_' + id).onmouseout = ???;
$('menu_link_' + id).href = 'javascript:ShowProfile( "' + id + '");';
} |
alors , la ou c est chaud, c est que quand on clique sur un element du menu, la page devient "active" et du coup plus de lien (pas cliquable) , et les rollover s en vont.
jusque la , tout va bien
par contre j ai du détuire mes callback sur onmouseover et onmouseout pour faire ca, comme ceci
Code:
1
2
3
|
$('menu_block_' + id).onmouseover = null;
$('menu_block_' + id).onmouseout = null; |
la difficulté , comme le tour est en ajax, et de restaurer les onmouseover , onmouseout apres coup (les ??? dans mon code plus haut)
j ai bien essayé
Code:
1
2
|
$('menu_block_' + id).onmouseover = MakeCornerOver(id); |
mais on dirais que Javascript cherche a placer id alors que c est une variable locale, du coup je me retrouve avec une erreur id est indéfini
j ai ensuite essayer divers eval , sans arriver a rien de concluant.
je serais assez embeté de faire une fonction par elements de menu vu le nombre de sous menu, mais faute de mieux si je trouve rien d ici demain , je vais faire ca , meme si je trouve ca nul
toute idée / suggestion est donc la bienvenue :P
Merci d avance
