Navigazione orizzontale

HTML

<div id="div1">Contenuto 1
    <div id="menu">  
        <a href="#div1">contenuto1</a>
        <a href="#div2">contenuto2</a>
        <a href="#div3">contenuto3</a>
        <a href="#div4">contenuto4</a>
    </div>
</div>



<div id="div2">
    Contenuto 2
</div>

<div id="div3">
    Contenuto 3
</div>

<div id="div4">
    Contenuto 4
</div>

CSS

#menu {
    position: fixed;
    bottom: 2px;
    left: 15px;
    height: 50px;
    color: white;
    z-index: 9999;
}


#div1 {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    background: red;
}

#div2 {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 100%;
    height: 100%;
    width: 100%;
    background: blue;
}

#div3 {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 200%;
    height: 100%;
    width: 100%;
    background: green;
}

#div4 {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 300%;
    height: 100%;
    width: 100%;
    background: yellow;
}