Hola
Alguien me podria decir como realizar la aparicion de un div oculto con un retardo de 1 o 2 segundos.
El codigo
Código HTML:
<div
onmouseover="document.getElementById('X').style.display='inline';"
onmouseout="document.getElementById('X').style.display='none';"
>Contenido</div>
<div id="X" name="X" style="display:none;"> Contenido oculto </div> Como hago para mostrar el contenido que esta oculto al pasar el mouse por div anterior y que demore un
tiempo en aparecer, teniendo el
id que
no se conocen precisamente el valor varia por
cada elemento div oculto.
Segui el siguiente ejemplo que modifique pero no funciona
Código HTML:
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.3.js"></script>
<script type="text/javascript">
var clas = "";
function hacerCosasDeVerdad(param1) {
clas = "."+param1;
$.ajax({
data: clas ,
success:
$(function() {
$(clas).hover( function(){
$(this).css('display', 'inline');
$(this).css('background-color', '#F00');
},
function(){
$(this).css('display', 'none');
$(this).css('background-color', '#FFF');
})
})
})
}
</script>
</head>
<body>
<div id="menu">
<div class="menuItem" onmouseover="hacerCosasDeVerdad('menuItem1');"
onmouseout="hacerCosasDeVerdad('menuItem1');"><a href=#>Bla</a></div>
<div class="menuItem" onmouseover="hacerCosasDeVerdad('menuItem2');"
onmouseout="hacerCosasDeVerdad('menuItem2');"><a href=#>Bla</a></div>
</div>
<div id="menu">
<div class="menuItem1" id="menuItem1" style="display: none;background-color: red;"><a href=#>Bla ocultp</a></div>
<div class="menuItem2" id="menuItem2" style="display: none;background-color: blue;"><a href=#>Bla socultp</a></div>
</div>
</body>
</html>