Problemas diseñando mi web

suggus #1 Oct '11 De piña

Buenas, preparaos porqué voy a usar este thread más de lo que quisiera, ya que me van surgiendo más dudas de las que en un principio creía posibles.
Veamos, estoy diseñando una web simple, con su cabecera, menu lateral izquierdo en el que irán las secciones, un tablón en el medio, y un menu derecho en el que están los links a Facebook y Twitter.
Estoy desarrollandolo todo con CSS y ahora me vienen los dos primeros problemas. Así que a ver si los puedo explicar detalladamente.

Cuando le doy a una opción del menú izquierdo, ¿hay alguna forma de que se muestre en el tablón lo que contiene sin tener que abrir un html completamente idéntico salvo por el contenido del "tablón"?
Estoy intentando hacer un menú horizontal dentro del tablón que según la opción que se seleccióne en el menú lateral izquierdo muestre unos contenidos o no. Se hacer un menú horizontal, es simple, el caso es que quiero que esté incrustado en el tablón y que haya una barra de scroll que vaya mostrando los contenidos ya que ahora mismo cuando no caben dentro de la caja del "tablón" saltan de linea. Os muestro una screen que me imagino que os ilustrará mejor:

Saludos y gracias. Que conste que solo es el esquema de la web XD

BLZKZ #2 Oct '11

iframes o recargando contenido con ajax. Ninguno de los dos casos los recomiendo para el uso que parece que le vas a dar.

saludos

1 1 respuesta

suggus #3 Oct '11 De piña

#2 mediante javascrypt y la funcion getElementById he conseguido algo, pero no consigo que sustituya el texto que quiero por un "cajón" que sirva de pestaña
function scroll_left(){
document.getElementById("mboption").innerHTML="hello world";
}
[...]
<li><a href="index.html" class="mblink"><div id="mboption">Welcome</div></a></li>

eXtreM3 #4 Oct '11

jQuery es tu solución. Busca cómo mostrar y ocultar capas haciendo clicks en los elementos del menú -> profit

2 1 respuesta

catalon #5 Oct '11 Inocente

#1 Si son pocos datos podrias cargarlo todo en capas ocultas y cuando hagas click en una opcion que se oculte la capa visible y se muestra la de esa opcion.
Para mostrar el scroll ese debes jugar con el overflow-x:auto.

LzO #6 Oct '11

#1 Podrias crear 6 capas (1 por opcion de menu), todas del mismo tamaño con posicion absoluta, colocada en la misma posicion top/left y visibility hidden.

Con javascript creas funcion onclick para que al clickear en los botones, por ejemplo boton projects, ponga todas hidden y visible la de projects y así...

Si quieres mejorar tus diseños y tu experiencia y sabes inglés te recomiendo tutoriales de como diseñar en photoshop y luego encima como pasarlos a html/css

38 tutoriales de pasar diseños ya hechos a xhtml: http://designbeep.com/2010/02/18/38-great-tutorials-to-convert-psd-to-htmlcss/

90 tutoriales de diseño de interfaz web: http://www.1stwebdesigner.com/tutorials/90-new-and-high-quality-photoshop-web-layout-tutorials/

#7 No es por ser un grano en el culo, pero seguro que llevas bien el diseño? xD

2 respuestas

suggus #7 Oct '11 De piña

#4 #6 precisamente eso es lo que quería. La programación y el diseño web lo llevo bien, el problema es que no se que lenguajes se asocian con que acciones / propiedades. En cuanto pueda probaré con Jquery. Muchísimas gracias por el consejo ^^ ya comentaré algo.

1 respuesta

suggus #8 Oct '11 De piña

#6 Si joer, que esa foto como he dicho solo la estoy haciendo en el pc para probar funciones y que todo vaya bien más adelante. Es un borrador. XD ya me tiré mis 6 horitas en el ps para diseñar menus cabezars y demases . Pero como digo, no me interesa verlos ahora, me interesa todo simple y con "cajas" para ver que está todo dónde toca... yo me entiendo

B

[Borrado] #9 Oct '11

#1 Por ahí te hablan de jQuery, Ajax... haz caso.

Aún así, esos problemas de generar nuevos htmls y tal... se te solucionarían haciendo un buen uso de algún framework intuitivo (véase symfony o django, aunque quizás tu propuesta de sitio web no necesite tanta historia).

Suerte.

Usuarios habituales