Ver Mensaje Individual
  #2 (permalink)  
Antiguo 07/10/2009, 08:03
RubenGuerrero
 
Fecha de Ingreso: abril-2009
Ubicación: Madrid
Mensajes: 94
Antigüedad: 15 años
Puntos: 2
Respuesta: Menu vertical siempre visible arriba cuando llegue al borde superior

La idea sería la siguiente:

Código HTML:
<!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>Menú a la Izq</title>
<style type="text/css">
<!--
#uno {
	height: 400px;
	width: 300px;
	left: 0px;
	top: 0px;
	position: fixed;
	background-color: #0F6;
	float: left; /*Esto lo que haces es flotar el div #uno a la izquierda*/
}
#dos {
	height: 500px;
	width: 500px;
	margin-left: 350px; /*Deja de margen la suma del menu más el margen que quieras dejar entre en menú y el contenido*/
	}
-->
</style>
</head>

<body>
<div id="uno"></div>
<div id="dos">
    <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus  tristique justo eu ipsum tincidunt sit amet porta augue ultricies.  Morbi lobortis mollis lectus eget vulputate. Vestibulum blandit diam  molestie dolor cursus vitae tincidunt tellus fermentum. Vestibulum id  lectus erat. Vestibulum vehicula malesuada dictum. Ut non metus eget  orci feugiat imperdiet ut nec sem. Nulla et nisl erat, non rutrum  tortor. Donec in enim ac tellus pharetra malesuada quis ac dui.  Maecenas volutpat purus non nisl porttitor tincidunt. Nulla  pellentesque libero non felis ultrices luctus. </p>
    <p>Suspendisse potenti. Sed dapibus justo in lacus cursus ornare.  Mauris tristique fringilla libero a auctor. Fusce euismod lorem ac nibh  imperdiet id interdum nibh condimentum. Integer sagittis nibh a neque  condimentum commodo. Proin bibendum purus in nunc consectetur interdum.  Pellentesque volutpat lobortis faucibus. Fusce at ipsum erat, eu  lacinia neque. Cras mauris libero, aliquet vel iaculis nec, faucibus  quis quam. Nulla scelerisque, erat quis auctor sagittis, mauris enim  volutpat libero, sit amet dapibus mauris leo ut massa. Nullam urna  sapien, pulvinar ac viverra ac, placerat a libero. Integer blandit arcu  id urna molestie pellentesque. Pellentesque ultrices ligula et urna  egestas gravida. </p>
    <p>Integer egestas fermentum rhoncus. Aliquam est orci, vehicula eu  sagittis vel, egestas nec massa. Etiam ligula nisi, malesuada ut tempor  nec, tincidunt in elit. Ut massa orci, vehicula vitae lobortis a,  rutrum vitae augue. In sodales placerat felis, in lacinia ligula tempor  sodales. Aliquam a arcu a sem cursus ornare ac et quam. Integer blandit  urna ac sem malesuada interdum. In libero magna, adipiscing in  imperdiet vel, elementum fermentum ante. Integer pulvinar magna quis  nibh ullamcorper sed hendrerit sapien convallis. Proin scelerisque nunc  sit amet sapien vulputate ac malesuada ipsum convallis. Maecenas nisi  tellus, congue et vestibulum ut, hendrerit id massa. Maecenas ipsum  nibh, tempor non placerat eu, viverra et nulla. Aenean nec massa neque,  vestibulum vulputate dolor. </p>
    <p>Fusce porta ante in nunc interdum pellentesque. Nam suscipit, felis  ut tempus ornare, velit enim molestie quam, eu gravida eros ipsum eget  velit. Aliquam vitae ipsum a mauris tincidunt dapibus at quis mauris.  Morbi non sapien non neque sodales luctus eu nec risus. Vivamus  ullamcorper consequat mi. Curabitur a lectus purus. Nam ut magna a  risus feugiat sollicitudin id a diam. Suspendisse potenti. Sed purus  neque, tempus nec cursus in, iaculis blandit lorem. Aenean non neque et  metus pharetra venenatis vel sit amet risus. </p>
    <p>Vestibulum eget ullamcorper quam. Morbi id sagittis magna. Quisque  vel mi posuere sem fermentum placerat. Donec tincidunt euismod  malesuada. Maecenas dapibus eros id felis auctor auctor. In mattis  viverra enim id fringilla. In hac habitasse platea dictumst. Quisque  quam ligula, vehicula non consectetur non, sollicitudin ac leo. Cras  consectetur imperdiet ultrices. Vivamus non semper nulla. Quisque  commodo egestas sapien, eu auctor sem cursus ut. Curabitur tempor  pulvinar enim quis accumsan. Suspendisse lectus enim, facilisis sit  amet tempor eu, bibendum quis massa. Quisque elit lectus, congue vel  dapibus in, laoreet quis urna. Vivamus dapibus, erat in condimentum  tincidunt, nunc turpis bibendum nulla, eu posuere velit lacus at dolor. </p>
    <p>Cras in enim in elit sagittis sodales. Donec ullamcorper rhoncus mi  ut sagittis. In hac habitasse platea dictumst. Proin arcu diam,  volutpat quis faucibus eget, adipiscing et nisi. Praesent dapibus eros  at magna malesuada lacinia. Phasellus sed nunc elit. Vestibulum vel  ante urna, sed porttitor felis. Vivamus scelerisque fermentum tellus,  sagittis luctus metus pretium non. Morbi tincidunt, diam eu imperdiet  iaculis, eros lectus pharetra justo, ac interdum lorem lorem ut eros.  Vivamus consequat eros erat. </p>
        <p>Phasellus facilisis lectus sit amet augue luctus tempor. Mauris ac  lacus in neque posuere eleifend malesuada ut diam. Sed tortor est,  rutrum nec mollis eu, fringilla vel turpis. Aliquam erat volutpat.  Suspendisse potenti. Cras suscipit massa consequat lorem tincidunt eget  egestas lorem aliquam. Quisque massa eros, porta ac vehicula volutpat,  feugiat at urna. Mauris laoreet, mi at viverra semper, sem sem feugiat  eros, laoreet scelerisque neque nunc id enim. Sed et purus faucibus  massa congue ultrices. Donec sed odio eget metus gravida sollicitudin.  Sed rutrum aliquet tellus, sodales convallis tellus porttitor ut.  Mauris accumsan nibh at mauris venenatis et pellentesque velit  suscipit. Nunc auctor, ligula quis pharetra suscipit, lorem lectus  pretium felis, non tempor enim metus non tortor. </p>
</div>
</body>
</html> 
Creo que es eso lo que quieres, delo lo contrario dimelo y vemos haber que pasa