Olás apesar de saber que este problema é bem específico, vou discutir a solução aqui assim mesmo, vai que alguém passa pelo mesmo … =)
é o seguinte, imagina uma div que precisa aumentar de tamanho quando passamos o mouse por cima, e reduzir quando saimos com o mouse de cima, pois bem isto seria bem facinho, bastava implementar algo no onmouseover, e o onmouseout e todo ficam felizes.
mas como nada é simples, tem dois labels dentro da div que são links, e quando o mouse vai sobre eles dispara o método onmouseout da div que os contém … assim foi necessário implementar uma solução que pudesse ter labels como links dentro de uma div expansível.
O jeito foi tratar os clicks do mouse na div e delegar para o comportamento de cada label, e para evitar diversos ifs com os nomes das labels preferi usar uma regra de nomes, onde o metodo chamado eh o nome do componente seguido de _onclick().
Este techo de codigo eh o tratador de cliques da div
function div1_onclick() {
for( var n=0; n < div1.children.count; n++ ){
var child = div1.children(n);
if( child.y < event.y
&& child.y + child.height > event.y ){
eval(child.name+'_onclick();');
debug.trace(child.name);
}
}
}
Note que percorro a lista de filhos da div, e baseado no event.y comparo se o o mesmo esta entre o y e o y+ altura do componente filho e assim identifico o nome do mesmo e uso para montar o nome do método a ser chamado, e com o método eval() executo o referido método. simples não ? =)
segue em anexo o codigo do google gadget para fazer isto.
E o gadget pronto para ser instalado
http://www.lively.com/dr?rid=-6058992854362690611
