elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Introducción a Git (Primera Parte)


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  Capas CSS con javascript invisibles.		0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: Capas CSS con javascript invisibles.  (Leído 4,070 veces)
NetJava

Desconectado Desconectado

Mensajes: 195



Ver Perfil
Capas CSS con javascript invisibles.
« en: 3 Junio 2011, 17:31 pm »
Buenas,

Tengo un problema, en mi pag web tengo un menú y en función del botón que presione quiero que se hagan invisibles las capas que no corresponden y que se haga visible la que corresponde, la idea es que sea como una aplicación de ordenador.
Para ello estoy utilizando javascrip, lo había conseguido en su momento, era un proyecto olvidado... pero he perdido el código que hice en su momento XD.

Código:
function VisibilidadCapas(String tipo = "") {
	if(ocument.getElementById("PrincipalInicio").style == true){
		document.getElementById("PrincipalInicio").style.visibility  = "visible"; 
		document.getElementById("AltaLibros").style.visibility  = "hidden";
	}
}

De javascrip no controlo mucho, se supone que tengo que identificar el id del div, y después hacer visible e invisible.
Me dais alguna pista XD. Saludos y gracias!!!
En línea
moyo18

Desconectado Desconectado

Mensajes: 61



Ver Perfil WWW
Re: Capas CSS con javascript invisibles.
« Respuesta #1 en: 3 Junio 2011, 17:50 pm »
proba esto.

Código:
function VisibilidadCapas(String tipo = "") {
	if(document.getElementById("PrincipalInicio").style == true){
		document.getElementById("PrincipalInicio").style.display  = "block"; 
		document.getElementById("AltaLibros").style.display  = "none";
	}
}

podes poner none, block o inline.

Ademas le agregue d a ocument.getElementById, talvez eso t este dando un error.
En línea
NetJava

Desconectado Desconectado

Mensajes: 195



Ver Perfil
Re: Capas CSS con javascript invisibles.
« Respuesta #2 en: 4 Junio 2011, 14:16 pm »
Buenas,
Ya he solucionado el problema, os lo dejo puesto, la idea es que según el botón que se presione desde la web se vayan cambiando las capas.

Código
  1. function show(item)
  2. {
  3. 	var PrincipalInicio=document.getElementById("PrincipalInicio")
  4. 	var AltaLibros = document.getElementById("AltaLibros")
  5. 	var BuscarLibros = document.getElementById("BuscarLibros")
  6. 	var BajaLibros = document.getElementById("BajaLibros")
  7. 	var RelacionarLibros = document.getElementById("RelacionarLibros")
  8. 	var Clasificacion = document.getElementById("Clasificacion")
  9. 	var Usuario = document.getElementById("Usuario")
  10.  
  11. 	if(item == 'PrincipalInicio')
  12. 	{
  13. 		PrincipalInicio.style.visibility='visible'
  14. 		AltaLibros.style.visibility='hidden'
  15. 		BuscarLibros.style.visibility='hidden'
  16. 		BajaLibros.style.visibility='hidden'
  17. 		RelacionarLibros.style.visibility='hidden'
  18. 		Clasificacion.style.visibility='hidden'
  19. 		Usuario.style.visibility='hidden'
  20. 	}
  21. 	if(item == 'AltaLibros')
  22. 	{
  23. 		AltaLibros.style.visibility='visible'
  24. 		PrincipalInicio.style.visibility='hidden'
  25. 		BuscarLibros.style.visibility='hidden'
  26. 	    BajaLibros.style.visibility='hidden'
  27. 		RelacionarLibros.style.visibility='hidden'
  28. 		Clasificacion.style.visibility='hidden'
  29. 		Usuario.style.visibility='hidden'
  30. 	}
  31. 	if(item == 'BuscarLibros')
  32. 	{
  33. 		BuscarLibros.style.visibility='visible'
  34. 		PrincipalInicio.style.visibility='hidden'
  35. 		AltaLibros.style.visibility='hidden'
  36. 		BajaLibros.style.visibility='hidden'
  37. 		RelacionarLibros.style.visibility='hidden'
  38. 		Clasificacion.style.visibility='hidden'
  39. 		Usuario.style.visibility='hidden'
  40. 	}
  41. 	if(item == 'BajaLibros')
  42. 	{
  43. 		BajaLibros.style.visibility='visible'
  44. 		PrincipalInicio.style.visibility='hidden'
  45. 		AltaLibros.style.visibility='hidden'
  46. 		BuscarLibros.style.visibility='hidden'
  47. 		RelacionarLibros.style.visibility='hidden'
  48. 		Clasificacion.style.visibility='hidden'
  49. 		Usuario.style.visibility='hidden'
  50. 	}
  51. 	if(item == 'RelacionarLibros')
  52. 	{
  53. 		RelacionarLibros.style.visibility='visible'
  54. 		PrincipalInicio.style.visibility='hidden'
  55. 		AltaLibros.style.visibility='hidden'
  56. 		BuscarLibros.style.visibility='hidden'
  57. 		BajaLibros.style.visibility='hidden'
  58. 		Clasificacion.style.visibility='hidden'
  59. 		Usuario.style.visibility='hidden'
  60. 	}
  61. 	if(item == 'Clasificacion')
  62. 	{
  63. 		Clasificacion.style.visibility='visible'
  64. 		PrincipalInicio.style.visibility='hidden'
  65. 		AltaLibros.style.visibility='hidden'
  66. 		BuscarLibros.style.visibility='hidden'
  67. 		BajaLibros.style.visibility='hidden'
  68. 		RelacionarLibros.style.visibility='hidden'
  69. 		Usuario.style.visibility='hidden'
  70. 	}
  71. 		if(item == 'Usuario')
  72. 	{
  73. 		Usuario.style.visibility='visible'
  74. 		PrincipalInicio.style.visibility='hidden'
  75. 		AltaLibros.style.visibility='hidden'
  76. 		BuscarLibros.style.visibility='hidden'
  77. 		BajaLibros.style.visibility='hidden'
  78. 		RelacionarLibros.style.visibility='hidden'
  79. 		Clasificacion.style.visibility='hidden'
  80. 	}
  81. }
  82.  
  83.  

Gracias por la respuesta, aunq era algo diferente al final, por lo menos lo que me salio claro. XD Saludos!!!
En línea
Cicklow


Desconectado Desconectado

Mensajes: 604


-=Cicklow SOFT®=-


Ver Perfil WWW
Re: Capas CSS con javascript invisibles.
« Respuesta #3 en: 7 Junio 2011, 08:19 am »
Con Jquery no es mas rapido y menos codigo?

Saludos
En línea
www.cicklow.com . Solo Soy Un Ciego que Ve El Sonido Del Silencio
NetJava

Desconectado Desconectado

Mensajes: 195



Ver Perfil
Re: Capas CSS con javascript invisibles.
« Respuesta #4 en: 7 Junio 2011, 16:27 pm »
jejejeje no lo se, soy novatillo en web... pero lo comprobaré XD Aunq no se a que nivel se puede medir la rapidez en este tema. Saludos!
En línea
Cicklow


Desconectado Desconectado

Mensajes: 604


-=Cicklow SOFT®=-


Ver Perfil WWW
Re: Capas CSS con javascript invisibles.
« Respuesta #5 en: 7 Junio 2011, 16:36 pm »
Puedes usar la funcion Toggle de Jquery. o Show y Hide...

http://www.designgala.com/demos/collapse-expand-jquery.html
http://api.jquery.com/toggle/
En línea
www.cicklow.com . Solo Soy Un Ciego que Ve El Sonido Del Silencio
NetJava

Desconectado Desconectado

Mensajes: 195



Ver Perfil
Re: Capas CSS con javascript invisibles.
« Respuesta #6 en: 7 Junio 2011, 17:09 pm »
Lo he estado mirando y esta genial aunq me va a costar trabajar con las funciones... pero bueno, merecerá la pena supongo. Me he bajado la librería versión 1.3 creo que se ha llegado hasta la 1.6 (eso dice wiki). En la segunda url he mirado los ejemplos, y tira de http://code.jquery.com/jquery-latest.js, es lo mismo que descargar y utilizar la librería¿?¿?

Un saludo y gracias!!!
En línea
Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

Mensajes similares
Asunto Iniciado por Respuestas Vistas Último mensaje
Mensajes invisibles (MSN) « 1 2 »
Programación Visual Basic 		‭lipman 14 4,840 Último mensaje 26 Junio 2007, 21:01 pm
por MazarD
Haciendonos Invisibles
Hacking 		tragantras 3 3,669 Último mensaje 29 Marzo 2010, 07:01 am
por Dr [F]
Archivos invisibles « 1 2 »
Criptografía 		Gambinoh 11 10,312 Último mensaje 16 Marzo 2011, 11:42 am
por APOKLIPTICO
Visitas indirectas / invisibles?
Desarrollo Web 		Cergath 3 2,275 Último mensaje 19 Agosto 2011, 06:42 am
por Shell Root
Datos invisibles en HDD???
Hardware 		Danyor 1 1,841 Último mensaje 12 Enero 2015, 02:31 am
por MinusFour
WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines