tengo una pequeña duda se puede hacer lo siguiente:
tengo que cargar en 4 div cierto numeros de elementos que son 4 imagenes en la cual todo eso funciona por medio de un $.hover() todos los elementos se cargan bien, pero mi pidieron algo en especial que se hiciera todo el procedimiento despues de 2 segundos de que esta el cursor este en el elemento para que cargue las 4 imagenes , como puedo retrasar toda la funcion que hago .
dejo parte de mi codigo
Código jquery:
Ver original$("#link-videos").
hover(function(){
tipo
=$("#caos-grid").
attr("class"); if(tipo != "video"){
$("#caos-grid").
attr("class","video"); tipo
=$("#caos-grid").
attr("class"); cambio_color(tipo);
}
});
function cambio_color(tipo){
//$("#caos-grid div a").remove()
$("#caos-grid").
fadeOut(1000, function(){ switch(tipo){
case "video":
tipo_contenido = "video";
//sessionStorage.getItem("proyector_video")
//if(sessionStorage.getItem("proyector_video"))
proyector(tipo_contenido);
$("#caos-grid").
delay(500).
fadeIn(1000); break;
case "foto":
tipo_contenido = "foto";
proyector(tipo_contenido);
$("#caos-grid").
delay(500).
fadeIn(1000); break;
case "juegos":
tipo_contenido = "juego";
proyector(tipo_contenido);
$(".juegos div a").
css("opacity"," 0.6"); $("#caos-grid").
delay(500).
fadeIn(1000); break;
case "actividades":
tipo_contenido = "descarga";
proyector(tipo_contenido);
$(".juegos div a").
css("opacity"," 0.6"); $("#caos-grid").
delay(500).
fadeIn(1000); break;
}
});
}
function proyector(args_content){
var login_storage = new Object();
if(JSON.parse(localStorage.getItem('login_avatar')) != null){
login_storage = JSON.parse(localStorage.getItem('login_avatar'));
}else{
login_storage.tipo_mundo = "";
}
async: true,
url: 'ruta del archivo php',
type: "POST",
tipo_contenido : args_content,
tipo_mundo : login_storage.tipo_mundo
},
url=0
imagen=1
x=1;
y=1;
for(var i=0; i<=3;i++){
//$("#caos-grid div").prepend("<a href='#' id=grid"+x+"x"+y+" style='background:url("+array[i]+") no-repeat; background-size: 210px 135px;'></a>")
$("#caos-grid div a:eq("+i
+")").
attr({id
:"grid"+x
+"x"+y
+"", style:"background:url("+array[imagen]+") no-repeat; opacity: 0.5; background-size: 210px 135px; height:135px;",
href:""+array[url]+""})
//background-size: 193px 131px; width: 193px; height: 131px;
$("#grid2x1").
css({left
:"7px", width:"210px"}); $("#grid1x1").
css({top
:"-10px"}); $("#grid1x2").
css({right
:"-19px",top
:"-10px"}); right:"-19px"});
url=url+2;
imagen=imagen+2;
if(y==2){
x=x+1;
y=1;
}else{
y=y+1;
}
}
}
});
}