Optimization

[DoomedLung]

Hey everyone is there a way in which I could optimize my code with
just one for loop (see code below). I've come across this issue a few
times now and haven't found a solution as yet.. As you can see from
the code below I'm reusing the same loop throughout three functions, I
basically see this as a waste. Is there a more efficient way where I
could use the for loop just the once.

var overStates = [
['0','imgs/membersHome/set01Over.jpg', 'imgs/membersHome/
set01Up.jpg'],
['1','imgs/membersHome/set02Over.jpg', 'imgs/membersHome/
set02Up.jpg'],
['2','imgs/membersHome/set03Over.jpg', 'imgs/membersHome/
set03Up.jpg'],
];

function imgState(event){
var target = getTarget(event, 'a'), i;
for(i = 0; i < overStates.length; i++){
amyObj.removeImgStates(i, 2);
if(overStates[0] == target.firstChild.name){
target.firstChild.src = overStates[1];
}
}
}

function overState(event){
var target = getTarget(event, 'a'), i;
for(i = 0; i < overStates.length; i++) {
if(overStates[0] == target.firstChild.name) {
target.firstChild.src = overStates[1];
}
}
}

function outState(event){
var target = getTarget(event, 'a'), i;
for(i = 0; i < overStates.length; i++){
if(overStates[0] == target.firstChild.name)
{
target.firstChild.src = overStates[2];
}
}
}

Cheers!

DoomedLung

 

[Thomas 'PointedEars' Lahn]

Hey everyone is there a way in which I could optimize my code with
just one for loop (see code below). I've come across this issue a few
times now and haven't found a solution as yet..

http://pointedears.de/scripts/test/dom/hoverMe/ might give you some ideas.


PointedEars

 

[David Golightly]

Hey everyone is there a way in which I could optimize my code with
just one for loop (see code below). I've come across this issue a few
times now and haven't found a solution as yet.. As you can see from
the code below I'm reusing the same loop throughout three functions, I
basically see this as a waste. Is there a more efficient way where I
could use the for loop just the once.

function makeHandler(idx){
return function (event) {
var target = getTarget(event, 'a'), i;
for(i = 0; i < overStates.length; i++){
if(overStates[0] == target.firstChild.name)
{
target.firstChild.src = overStates
[idx];
}
}
}
}


var overState = makeHandler(1);
var outState = makeHandler(2);

By the way, you should probably reconsider re-setting <img-tag>.src,
as IE6 has bugs when rendering images that are not the same
proportions. Create a fresh image tag instead (using
img.cloneNode(false).

If you're using images in a navigation bar for clickable links, try
using CSS background images using :hover replacement instead. You can
avoid JS altogether if that's the case.

-David