Foros del Web » Creando para Internet » Diseño web »

Como conseguir este diseño

Estas en el tema de Como conseguir este diseño en el foro de Diseño web en Foros del Web. Hola Mirar exactamente no se si es el sitio correcto pero no se exactamente donde ponerlo. La cuestión es que en mi blog uso una ...
  #1 (permalink)  
Antiguo 11/03/2007, 15:33
Avatar de srwolfman  
Fecha de Ingreso: marzo-2007
Mensajes: 10
Antigüedad: 10 años, 9 meses
Puntos: 0
Como conseguir este diseño

Hola
Mirar exactamente no se si es el sitio correcto pero no se exactamente donde ponerlo.
La cuestión es que en mi blog uso una opción para mostrar ocultar información y lo que me gustaría hacer es que cada vez que le doy en algún apartado se muestre y cuando le doy a otro se muestre y oculte el otro.
Tengo algo parecido en el blog pero no se oculta cuando selecciono otro apartado.
Todo esto viene porque un dia vi una página que lo hacia y me gustaría aplicarlo.

Saludos
  #2 (permalink)  
Antiguo 11/03/2007, 16:44
Avatar de FNX_NET  
Fecha de Ingreso: marzo-2004
Ubicación: EN EL INFIERNO.....
Mensajes: 1.707
Antigüedad: 13 años, 8 meses
Puntos: 7
Re: Como conseguir este diseño

podrias masndar el link


aunque eso me suena que se hace un javascripts, o de forma mas sofisticada en ajax, puedes postear alli tu problema y te ayudaran
__________________
:-D "Que se libere del cielo confinado; que mi cuerpo sea la espada de hielo negro que nos lleve al abismo; que ningún poder pueda detenernos...Destructora de las almas de los dioses!!!":adios:


:pirata:
  #3 (permalink)  
Antiguo 11/03/2007, 17:50
Avatar de srwolfman  
Fecha de Ingreso: marzo-2007
Mensajes: 10
Antigüedad: 10 años, 9 meses
Puntos: 0
Re: Como conseguir este diseño

OK repetire el post en javascript Sobre el link a que te refieres a donde lo vi, por desgracia no lo tengo y sobre mi blog no me deja hasta que no lleve una cantidad de entradas pero seria srwolfman.blogspot.com
  #4 (permalink)  
Antiguo 12/03/2007, 05:57
Avatar de yournightmare86  
Fecha de Ingreso: abril-2006
Ubicación: Madrid
Mensajes: 875
Antigüedad: 11 años, 7 meses
Puntos: 9
Re: Como conseguir este diseño

Pues mira te dejo un ejemplo que juega con la propiedad hidden de las capas usando javascript.
Código:
<html>
<head>
<STYLE TYPE="text/css">
		#capa0{background-color:turquoise;
			   position:absolute; top:20px; left:50px; width:508px; height:75px;}
		
		#capa1{background-color:lightblue;visibility:hidden;
			   position:absolute; top:100px; left:100px; width:400px; height:300px;}
			   
		#capa2{background-color:yellow;visibility:hidden;
			   position:absolute; top:100px; left:100px; width:400px; height:300px;}
		
		#capa3{background-color:orange;visibility:hidden;
			   position:absolute; top:100px; left:100px; width:400px; height:300px;}
			   
		#capa4{background-color:pink;visibility:hidden;
			   position:absolute; top:100px; left:100px; width:400px; height:300px;}
		
		#ninguna{background-color:lawngreen;
			   position:absolute; top:100px; left:100px; width:400px; height:300px;}
		
		
</style>
<script>
function ocultar()
{


document.all.capa1.style.visibility='hidden';
document.all.capa2.style.visibility='hidden';
document.all.capa3.style.visibility='hidden';
document.all.capa4.style.visibility='hidden';
document.all.ninguna.style.visibility='hidden';
}

function mostrar(n)
{
switch (n)
{
	case 1:
	document.all.capa1.style.visibility='visible';
	break;
	case 2:
	document.all.capa2.style.visibility='visible';
	break;
	case 3:
	document.all.capa3.style.visibility='visible';
	break;
	case 4:
	document.all.capa4.style.visibility='visible';
	break;
}
}
	
</script>
</HEAD>
<BODY>
<div id="capa0">
Haz click en la foto q deseas ver
<br>
<A HREF="javascript:ocultar();mostrar(1);">foto 1</a>
<A HREF="javascript:ocultar();mostrar(2);">foto 2</a>
<A HREF="javascript:ocultar();mostrar(3);">foto 3</a>
<A HREF="javascript:ocultar();mostrar(4);">foto 4</a>


</div>
<center>
<div id="capa1">
imagenes
<p><img border="0"src="foto1.jpg" width="300" height="300"></p>
bonita
</div>

<div id="capa2">
imagenes
<p><img border="0"src="foto2.jpg" width="300" height="300"></p>
preciosa
</div>

<div id="capa3">
imagenes
<p><img border="0"src="foto3.jpg" width="300" height="300"></p>
yo quiero :(
</div>

<div id="capa4">
imagenes
<p><img border="0"src="foto4.jpg" width="300" height="300"></p>
oooleeee!!!!!
</div>

<div id="ninguna">
<hr size="5">
HAZ CLICK EN LA FOTO Q KIEREAS VER
<hr size="5">
</div>


</BODY>
</HTML>
Este ejemplo es una galería de fotos, que juega con capas, y cuando pinchas en el link de cada capa, oculta la activa y deja visible la que pulsaste. Pruebalo y pon las imagenes que quieras, el resto será adaptarlo a lo que quieras.
  #5 (permalink)  
Antiguo 12/03/2007, 08:24
Avatar de srwolfman  
Fecha de Ingreso: marzo-2007
Mensajes: 10
Antigüedad: 10 años, 9 meses
Puntos: 0
Re: Como conseguir este diseño

Hola y merci por contestar yournightmare86.
Pero el ejemplo tienes que ir creando capas para hecerlo y yo necesito un efecto acordeon que he encontrado pero aun no se muy bien como aplicarlo.
Lo encontre en ...moofx.mad4milk.net/#prototype lo de prototype es por que uso esa coleccion para otra funcion de los comentarios.
Saludos
  #6 (permalink)  
Antiguo 12/03/2007, 10:41
Avatar de yournightmare86  
Fecha de Ingreso: abril-2006
Ubicación: Madrid
Mensajes: 875
Antigüedad: 11 años, 7 meses
Puntos: 9
Re: Como conseguir este diseño

Si me pones el link de una página como ejmplo puedo tratar de mirarlo, pero vamos mejor te asesorarán en el foro de Javascript.
  #7 (permalink)  
Antiguo 12/03/2007, 20:13
Avatar de srwolfman  
Fecha de Ingreso: marzo-2007
Mensajes: 10
Antigüedad: 10 años, 9 meses
Puntos: 0
Re: Como conseguir este diseño

Cita:
Iniciado por yournightmare86 Ver Mensaje
Si me pones el link de una página como ejmplo puedo tratar de mirarlo, pero vamos mejor te asesorarán en el foro de Javascript.
Hola mira yo de momento no puedo poner enlaces a otras páginas pero en:
ht...moofx.mad4milk.net/#prototype que esta en ingles puedes ver lo que digo y si te vas a mi perfil tienes la dirección de mi blog.
Gracias
Mirare en el foro de javascript.
  #8 (permalink)  
Antiguo 13/03/2007, 01:31
(Desactivado)
 
Fecha de Ingreso: marzo-2007
Mensajes: 21
Antigüedad: 10 años, 9 meses
Puntos: 0
Re: Como conseguir este diseño

con vbscript puedes hacer aparecer y desaparecer cualquier objeto
en la pantalla htm.
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 19:31.