I was building a site where you roll over a list of links and the class changes and also a box of information changes, my code works like this:
$(document).ready(function() {
$(“#link1”).mouseover(function () {
for (var i=1; i < 7; i++){
$("#link"+i).removeClass("orangeArrow");
$("#link"+i).addClass("greenArrow");
$("#toggle"+i).css("display","none");
}
$("#link1").removeClass("greenArrow");
$("#link1").addClass("orangeArrow");
$("#toggle1").css("display","block");
});
});
but i had to rewrite this code for all 6 elements i had imagined it to work like this to cycle through all 6 elements and add the correct listener:
$(document).ready(function() {
for (var j=1; j<7; j++){
$(“#link”+j).mouseover(function () {
for (var i=1; i < 7; i++){
$("#link"+i).removeClass("orangeArrow");
$("#link"+i).addClass("greenArrow");
$("#toggle"+i).css("display","none");
}
$("#link"+j).removeClass("greenArrow");
$("#link"+j).addClass("orangeArrow");
$("#toggle"+j).css("display","block");
});
}
});
the result i had was that the listener event was present but it only cycled through the the for i loop, and just ignored the second part.
As i write this i realise there would be no j variable when it is called? Any ideas on getting this tidier