24/10/2011, 15:50
|
| | | Fecha de Ingreso: octubre-2011 Ubicación: Medellín
Mensajes: 3
Antigüedad: 12 años, 6 meses Puntos: 0 | |
 simplificar muchos if else
Hola chicos
tengo actualmente una duda, como se darán cuenta no programo mucho pero quisiera un consejo para esta opción.
los contextualizo, lo que intento hacer que un menú cambie según la zona de la pagina en la que este, aunque actualmente son solo colores, es para 4 item si lo hago para 10 serian demasiadas lineas de código no?; hay manera de simplificarlo con alguna funcion o ... bueno aqui les dejo lo que he usado
window.onload = initAll;
function initAll()
{
document.getElementById("item1").style.background= "#960a00";
document.getElementById("item2").style.background= "#fff";
document.getElementById("item3").style.background= "#fff";
document.getElementById("item4").style.background= "#fff";
document.getElementById("item1").style.color="#fff ";
document.getElementById("item2").style.color="#960 a00";
document.getElementById("item3").style.color="#960 a00";
document.getElementById("item4").style.color="#960 a00";
}
function checkPosition()
{
var posx = $(window).scrollLeft();
if (posx > 0 && posx <= 1450)
{
document.getElementById("item1").style.background= "#960a00";
document.getElementById("item2").style.background= "#fff";
document.getElementById("item3").style.background= "#fff";
document.getElementById("item4").style.background= "#fff";
document.getElementById("item1").style.color="#fff ";
document.getElementById("item2").style.color="#960 a00";
document.getElementById("item3").style.color="#960 a00";
document.getElementById("item4").style.color="#960 a00";
}
else if (posx > 1450 && posx <= 3400)
{
document.getElementById("item1").style.background= "#fff";
document.getElementById("item2").style.background= "#960a00";
document.getElementById("item3").style.background= "#fff";
document.getElementById("item4").style.background= "#fff";
document.getElementById("item1").style.color="#960 a00";
document.getElementById("item2").style.color="#fff ";
document.getElementById("item3").style.color="#960 a00";
document.getElementById("item4").style.color="#960 a00";
}
else if (posx > 3400 && posx <=5440)
{
document.getElementById("item1").style.background= "#fff";
document.getElementById("item2").style.background= "#fff";
document.getElementById("item3").style.background= "#960a00";
document.getElementById("item4").style.background= "#fff";
document.getElementById("item1").style.color="#960 a00";
document.getElementById("item2").style.color="#960 a00";
document.getElementById("item3").style.color="#fff ";
document.getElementById("item4").style.color="#960 a00";
}
else if (posx > 4840 && posx <=6700)
{
document.getElementById("item1").style.background= "#fff";
document.getElementById("item2").style.background= "#fff";
document.getElementById("item3").style.background= "#fff";
document.getElementById("item4").style.background= "#960a00";
document.getElementById("item1").style.color="#960 a00";
document.getElementById("item2").style.color="#960 a00";
document.getElementById("item3").style.color="#960 a00";
document.getElementById("item4").style.color="#fff ";
}
}
$(window).scroll( checkPosition ); |