Hola!

Registrándote como bakuno podrás publicar, compartir y comunicarte en privado con otros bakuos :D

Regístrame ya!

Como se hace este efecto?

M

Mirdrack

Bovino adicto
Desde
21 May 2008
Mensajes
529
Hola corral:

Código: 
http://www.dynamicdrive.com/style/csslibrary/item/css-tableless-form/

En esta pagina esta una caja con codigo
Pero tiene una pestaña llamada expand en la que si das click
La caja de codigo se hace mas grande
Alguien tiene idea de como se hace? o que lenguaje permite hacer esto?

Thnks:vientos:
 
se hace con html, css y javaScript, no es nada del otro mundo. Te lo explico a grandes rasgos:
El codigo que quieres tener oculto y después expandirlo lo pones en un div y le das una ID.

Código: 
<div id="oculto">Este codigo esta oculto y no se mostrará todavia</div>
En el css creamos un estilo para nuestra capa recien creada:

Código: 
#oculto
{
     visibility:"hidden";
}
Depues creamos el enlace que al pulsarlo hará que se muestre el código:
Código: 
<a href:"javascript:void(0);" onclick:"mostrar('oculto');">Leer mas</a>
por ultimo creamos una funcion java script, esta va en las etiquetas <head>

Código: 
<script type:"text/javascript">
 function mostrar (elemento)
{
   getElementById(elemento).style.visibility="visible";
}
</script>
Y listo, ya debe de funcionar. caba aclarar que es posible que tenga errores de sintanxis ya que lo estoy escribiendo de memoria y siempre se me pasan dos 3 cositas, por eso usa dreamweaver que te ayuda con la sintaxis.
 
Jaja me ganaron el de sugerir jquery, tiene muchisimos ejemplos sencillos de programar, es mas ni te tienes que meter tanto al css, pero recuerda en vez de usar visibility:hidden; usa display:none; ya que el jquery usa la propiedad display para sus efectos, la propiedad visibility deja el espacio y como que le da una transparencia de 100%
 
GRACIAS A MI ME SERVIRA PARA FUTUROS PROYECTOS
 
Debes iniciar sesión o registrarte para participar.
Volver
Arriba