Menú como panel de YouTube

[laratik]

Rápidamente se me ocurre esto:

Código HTML:

<div id="target">CONTENIDO</div>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
 

Código CSS:

#target {
    background: #00F;
    color:#FFF;
    text-align: center;
    width: 500px;
    left: 50%;
    margin-left: -250px;
    margin-top: 200px;
    position: absolute;
}
 

Código Javascript:

function fijar()
{
    variable = document.getElementById("target").offsetTop;
    window.onscroll = cambioScroll;
}
 
function cambioScroll(e)
{
    if(document.body.scrollTop >= variable) {
        document.getElementById("target").style.position = "fixed";
        document.getElementById("target").style.marginTop = "0px";
    } else {
        document.getElementById("target").style.position = "absolute";
        document.getElementById("target").style.marginTop = "200px";
    }
}
 

Claro que lo puedes mejorar, pero para dar una guia no creo que este mal.