Buscador
.

02 noviembre 2011

Como esconder un texto o contenido con un botón

Con este efecto puedes esconder cualquier texto o contenido de tu página que se hará visible al hacer clic en un botón. 


El código que tienes que utilizar es este 

<center><div class="pre-spoiler">    <input id="xs" value="Ver texto" style="margin-left: 50px; padding: 0px; width: 80px; font-size: 14px; font-family: trebuchet ms;" onclick=    "if(this.parentNode.getElementsByTagName('div')[0].style.display != ''){this.parentNode.getElementsByTagName('div')[0].style.display = '';this.value = 'Ocultar texto';}else{this.parentNode.getElementsByTagName('div')[0].style.display = 'none'; this.value = 'Ver texto';}"    type="button" />    <div class="spoiler" style="display: none;">      Aquí ponemos la parte que queremos ocultar </div></div></center>
Lo que está en azul y rojo lo cambias por el mensaje que mostrará el botón 








23 comentarios:

  1. Perdona siempre me funciona vuestros trucos pero este no hay manera de conseguirlo.
    No se si es por que es un texto un poco largo "una cancion"
    por favor esplicame el texto lo pongo en donde dice "Aquí ponemos la parte que queremos ocultar", y en lo rojo y azul pongo el texto que quiero en el boton?.
    Gracias por todo
    Saludos:-))

    ResponderEliminar
    Respuestas
    1. Si gustas dime lo que quieres ocultar y yo te envío el código :)

      Eliminar
  2. Ya está todo arreglado, funciona perfectamente, me servirá para muchas otras cosas en mi web, Gracias por vuestra labor
    Saludos cordiales

    ResponderEliminar
    Respuestas
    1. Qué bien que lo hayas solucionado :) cualquier duda no dudes en escribir :D

      Eliminar
  3. Hola, veo que eres muy amable en contestar me gustaria que el boton lo pudiera cambiar de color que fuera un rojo oscuro tirando a bordo pero no de en que parte del texto poner el atributo si me puedes contestar a juancsuarez1@yahoo.com.ar
    Gracias

    ResponderEliminar
  4. Saludos, es muy buena tu pagina!
    soy novato y no se nada de programación pero quería incluir algo parecido a un menú de pestañas... y me preguntaba si este script serviría o ¿habría alguna forma de hacer que el contenido se oculte automáticamente cuando se le de click a otro botón que tenga otro contenido oculto?
    Gracias.
    culturaglobal.ve@gmail.com
    http://culturaglobal.co.cc

    ResponderEliminar
  5. A qué te refieres con menú de pestañas? puedes darme un ejemplo o cómo es que funciona?

    ResponderEliminar
  6. Hola! estoy intentando desde hace un buen rato ocultar parte de un texto que es muy largo pero no consigo que funcione finalmente. Si me aparece oculto, y también el botón de Leer más (es el nombre que yo le he dado), pero cuando hago click en lugar de mostrarme el resto del texto me sube a la parte de arriba de la página y pese a bajar con el scroll sigue sin mostrarse.
    Podrías ayudarme?

    Muchas gracias

    ResponderEliminar
  7. sepuede aser eso pero con un boton de me gusta de facebook?

    ResponderEliminar
  8. como hago para cambiar el color del texto, muchas gracias, tu trabajo es genial

    ResponderEliminar
  9. funciono muy bien! Gracias!

    ResponderEliminar
  10. esta muy bien!! gracias por compartirlo ¿como se cambia el color de fondo para que sea blanco o beige? tras el texto negro Gracias!!

    Un saludo, Manolo.

    ResponderEliminar
    Respuestas
    1. gracias, lo he solucionado!!, lo he puesto aqui y era lo que buscaba, comparto :)

      PD no me deja copiar el codigo, lo siento. dejo una imagen

      http://fotos.subefotos.com/daa126781bbb9ef6a66e43cab6926822o.png

      Eliminar
  11. Hola:

    Necesito un codigo de html para mostrar y ocultar texto...Me urgeeeeee!!!!


    NOTA: MI SERVER NO ACEPTA PHP NI JAVA, SOLO HTML

    GRACIAS

    ResponderEliminar
  12. Hola! quiero ocultar el enlace de inicio de sesion y cuando trato de hacerlo por medio de ajustes me dice que de comprar Jimbopro,existe otra forma de ocultar este enlace?

    ResponderEliminar
  13. Se podría ocultar en vez de un texto una ventana que saliera al darle al botón?

    ResponderEliminar
  14. Bueno, y si no una ventana de texto... Una imagen o gif....

    ResponderEliminar
  15. Hola podrias decirme por favor como esta hecho el esconder el texto de la pagina http://mycyberacademy.com/ , con un ejemplo sencillo y que sea parecido? sebascuarzo(arroba)gmail.com, muchas gracias y un cordial saludo.

    ResponderEliminar
  16. No me funciona, no entiendo porque. No se ve ni el botón ni del texto. Ayuda please

    ResponderEliminar
  17. No me funciona, no entiendo porque. No se ve ni el botón ni del texto. Ayuda please

    ResponderEliminar
  18. Gracias por el dato use esta info en mi web www.nenaslima.com

    ResponderEliminar
  19. amigo yo ando haciendo un formulario de registro pero el problema tengo para ocultar el boton digamos si no estoy registrado que desaparesca el boton y me aparesca un boton nuevo

    ResponderEliminar