Retroceder   Foros del Web > Diseño de Sitios web > Web general

Respuesta
 
Herramientas Desplegado
Antiguo 11-mar-2007, 14:33   #1 (permalink)
srwolfman no se puede cailificar en este momento
 
Avatar de srwolfman
 
Fecha de Ingreso: marzo-2007
Mensajes: 10
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
srwolfman está desconectado   Responder Citando
Antiguo 11-mar-2007, 15:44   #2 (permalink)
FNX_NET está en el buen camino
 
Avatar de FNX_NET
 
Fecha de Ingreso: marzo-2004
Ubicación: EN EL INFIERNO.....
Mensajes: 1.333
Enviar un mensaje por AIM a FNX_NET Enviar un mensaje por MSN a FNX_NET Enviar un mensaje por Yahoo  a FNX_NET
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:
FNX_NET está desconectado   Responder Citando
Antiguo 11-mar-2007, 16:50   #3 (permalink)
srwolfman no se puede cailificar en este momento
 
Avatar de srwolfman
 
Fecha de Ingreso: marzo-2007
Mensajes: 10
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
srwolfman está desconectado   Responder Citando
Antiguo 12-mar-2007, 04:57   #4 (permalink)
yournightmare86 tiene algunos puntos positivos de karma
 
Avatar de yournightmare86
 
Fecha de Ingreso: abril-2006
Ubicación: Madrid
Mensajes: 833
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.
yournightmare86 está desconectado   Responder Citando
Antiguo 12-mar-2007, 07:24   #5 (permalink)
srwolfman no se puede cailificar en este momento
 
Avatar de srwolfman
 
Fecha de Ingreso: marzo-2007
Mensajes: 10
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
srwolfman está desconectado   Responder Citando
Antiguo 12-mar-2007, 09:41   #6 (permalink)
yournightmare86 tiene algunos puntos positivos de karma
 
Avatar de yournightmare86
 
Fecha de Ingreso: abril-2006
Ubicación: Madrid
Mensajes: 833
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.
yournightmare86 está desconectado   Responder Citando
Antiguo 12-mar-2007, 19:13   #7 (permalink)
srwolfman no se puede cailificar en este momento
 
Avatar de srwolfman
 
Fecha de Ingreso: marzo-2007
Mensajes: 10
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.
srwolfman está desconectado   Responder Citando
Antiguo 13-mar-2007, 00:31   #8 (permalink)
(Desactivado)
guillermorafael no se puede cailificar en este momento
 
Fecha de Ingreso: marzo-2007
Mensajes: 21
Re: Como conseguir este diseño

con vbscript puedes hacer aparecer y desaparecer cualquier objeto
en la pantalla htm.
guillermorafael está desconectado   Responder Citando
Respuesta

No hay votos aún.


Herramientas
Desplegado

Normas de Publicación
No puedes crear nuevos temas
No puedes responder temas
No puedes subir archivos adjuntos
No puedes editar tus mensajes

BB code is Activado
Caritas están Activado
[IMG] está Activado
Código HTML está Desactivado


La Zona horaria es GMT -6. Ahora son las 22:51.


Message Board Statistics

LinkBacks Enabled by vBSEO 3.1.0

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93