javascript: função simples

[undeaddddd]

function t(n) {
imgs = document.getElementById('h').getElementsByTagName('img');
for(i = 0; i < imgs.length; i++) {
document[imgs.name].src = "images/t/" + imgs.name + ".png";
document[imgs.name].onmouseover = function() { document[imgs.name].src = "images/t/" + imgs.name + "_h.png"; }
document[imgs.name].onmouseout = function() { document[imgs.name].src = "images/t/" + imgs.name + ".png"; }
}
document[n].src = "images/t/" + n + "_h.png";
document[n].onmouseover = function() {}
document[n].onmouseout = function() {}
}

-----
Do tipo, alguém me sabe indicar o que está errado no código acima? No html tenho um div com id="h" em que dispõe de 4 imagens, em que cada uma delas tem no onlick uma chamada para a função t, enviando para a mesma o valor da propriedade name da imagem em questão, clicada; as mesmas têm efeitos onmouseover e onmouseout. A função foi feita com o intuito de sempre que clique numa das imagens, que é tipo uma selecção de menús e aparecimento de conteúdo, ela, através do for, faz um reset aos links desse get das 4 imagens, e em baixo mete em hover apenas a clicada, visto que manda o nome da imagem pelo n. Está tudo a funcionar como pretendido menos ao clicarmos, porque fica hovered a imagem, mas as outras deixam de ter efeito onmouseover e onmouseout, o que me levou a acrescentar os mesmos no ciclo for, mas sem sucesso.

Agradecia uma mãozinha, sff.. sou novo em javascript :$

 

[OldMan]

sou novo em javascript :$

www.jquery.com

 

[undeaddddd]

jquery no, thanks só uso um script ou outro de lá.. tou fazendo este site todo de raiz, por mim.. daí a não ter recorrido a scripts pré-feitos ou já mesmo feitos :/ só gostava de saber o que está mal aí.

 

[OldMan]

Mete isso online para se perceber melhor o que está a acontecer.

 

[undeaddddd]

www.re-match.org/meu ... segundo menú à direita (:

 

[OldMan]

Estive a tentar descobrir maneira de fazer o que querias mas não cheguei lá.

Eu tentaria outra lógica, vê se consegues percebes:

mouseover
IF alt != 'clicked'
> src=imagem_h.png
> alt='hover'
mouseout
IF alt != 'clicked'
> src=imagem.png
> alt=''
click
> src=imagem_h.png
> alt='clicked'

Ou seja, usavas o atributo alt (ou outro qualquer) para guardar o estado desse menu que ias verificar sempre que passasses o rato por cima. Acho que resultava, mas não experimentei.

 

[undeaddddd]

hmm, percebi.. mas o que queria era evitar tanto trabalho, simplificar tudo numa função.. não percebo mesmo o que está mal aqui, tá tudo certo.. o único que falha é:

document[imgs.name].onmouseover = function() { document[imgs.name].src = "images/t/" + imgs.name + "_h.png"; }
document[imgs.name].onmouseout = function() { document[imgs.name].src = "images/t/" + imgs.name + ".png"; }

ou essas mesmas propriedades, nas respectivas imagens.

:/

 

[undeaddddd]

feito

function t(n) {
imgs = document.getElementById("h").getElementsByTagName("img");
for(i = 0; i < imgs.length; i++) {
document[imgs.name].src = "images/t/" + imgs.name + ".png";
document[imgs.name].removeAttribute("onmouseover");
document[imgs.name].removeAttribute("onmouseout");
document[imgs.name].setAttribute("onmouseover", "h('" + imgs.name + "');");
document[imgs.name].setAttribute("onmouseout", "o('" + imgs.name + "');");
}
document[n].src = "images/t/" + n + "_h.png";
document[n].onmouseover = function() {}
document[n].onmouseout = function() {}
}

// resolvi, (:

 

[p3dro]

function t(n) {
imgs = document.getElementById("h").getElementsByTagName("img");
for(i = 0; i < imgs.length; i++) {
document[imgs.name].src = "images/t/" + imgs.name + ".png";
document[imgs.name].removeAttribute("onmouseover");
document[imgs.name].removeAttribute("onmouseout");
document[imgs.name].setAttribute("onmouseover", "h('" + imgs.name + "');");
document[imgs.name].setAttribute("onmouseout", "o('" + imgs.name + "');");
}
document[n].src = "images/t/" + n + "_h.png";
document[n].onmouseover = function() {}
document[n].onmouseout = function() {}
}

// resolvi, (:

Aquele código inicial dava-te erro pois não conseguías aceder ao imgs.name dentro da função, terias de adoptar outra forma para passar essa informação, por ex. desta maneira:

for (var i = 0, count = imgs.length; i < count; i++) {
  var img=imgs[i].name;

  document[img].src = "images/t/" + img + ".png";

  document[imgs[i].name].onmouseover = function(pic){
    return function() { document[pic].src = "images/t/" + pic + "_h.png"; }
  }(img);

  document[img].onmouseout = function(pic) {
    return function() { document[pic].src = "images/t/" + pic + ".png"; }
  }(img);
}

 

[undeaddddd]

mas pedro, isso funcionava, que testei com alert e tudo.. o problema era o .onmouseover e .onmouseout que não me ficavam activos e ao clicar numa das imagens, desactivava esse efeito nelas todas.. mesmo com eles na tag img, no html.. talvez faltasse um return, como tens aí.. anyway, javascript ainda não é bem para mim, só coisinhas básicas, ainda mas thanks aí (: