Foros del Web - Ver Mensaje Individual

chinanzio · #4 (**permalink**) 02/05/2012, 10:27

Algo asi te sirve ?

quiero decir, la idea, oviamente que le falta elaboración :P

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Insert title here</title>
 
<style>
    .contenido {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
    }
    
    .barra-inferior {
        display: none;
        width: 100%;
        position: absolute;
        bottom: 0;
        background-color: #AEEAA0;
    }
</style>
<script>
    function muestra() {
        var barraInferior = document.getElementById("barra-inferior");
        barraInferior.style.display = "inline-block";
    }
 
    function oculta() {
        var barraInferior = document.getElementById("barra-inferior");
        barraInferior.style.display = "none";
    }
</script>
</head>
<body>
    <div class="contenido">
        <a href="http://www.google.es" onmouseover="muestra();" onmouseout="oculta();">enlace 1</a>
    </div>
    <div id="barra-inferior" class="barra-inferior">
        Explicación del enlace
    </div>
</body>
</html>