Foros del Web - Ver Mensaje Individual

emprear · #3 (**permalink**) 21/01/2012, 16:00

En primer lugar, bienvenido.... @rpairo

Como es la cosa, hacer un hover ó hacer un mover?, pensé que era un error de tipeo, pero como repetís eso de "mover" 2 veces, me queda la duda.

Bueno, supongo que es hover, hace poco hice una página que usaba algo mas o menos similar
http://emprear.com.ar/competencia2011/
Tenés que verla con Firefox o Chrome, si esperás a que aparezca el texto "que le regalamos a Papa noel", vas a ver que hay tres opciones, que al hacerles hover, muestran un contenido que por defecto está oculto, una versión simplificada (que podés ver con cualquier navegador)sería

Código HTML:

Ver original<!DOCTYPE html>
<html lang="es-ar">
<head>
<meta charset="utf-8" />
<title>titulo</title> 
<style type="text/css">
/*<![CDATA[*/
figure.regalo_oculto_uno, figure.regalo_oculto_dos, figure.regalo_oculto_tres{
display: none;
}
 
div.regalo_oculto_uno:hover figure.regalo_oculto_uno{
display:block;
}
 
div.regalo_oculto_dos:hover figure.regalo_oculto_dos{
display:block;
}
 
div.regalo_oculto_tres:hover figure.regalo_oculto_tres{
display:block;
}
 
figcaption{
text-align: center;
}
/*]]>*/
</style>
</head>
<body>
 
<div class="regalo_oculto_uno">Que les parece esto?<br />
<figure  class="regalo_oculto_uno"><a href="smart-un-regalo-para-santa" class="cand">aqui va algo oculto</a>    
</figure>   
</div>
<div class="regalo_oculto_dos">O tal vez esto?<br />
<figure  class="regalo_oculto_dos"><a href="amianto-un-regalo-para-santa" class="cand">aqui va algo oculto</a>  
</figure>   
</div>
<div class="regalo_oculto_tres">Y por qué no esto?<br />
<figure  class="regalo_oculto_tres"><a href="carro-un-regalo-para-santa" class="cand" >aqui va algo oculto</a>
</figure>   
</div>
 
</body>
</html>

Y no se usa JavaScript

SAludos