transicciones y animaciones en web

Foro de elhacker.net

Programación

Desarrollo Web (Moderador: #!drvy)

transicciones y animaciones en web

0 Usuarios y 1 Visitante están viendo este tema.

Páginas: [1]

Autor

Tema: transicciones y animaciones en web (Leído 2,054 veces)

fernandorb10

Desconectado

Mensajes: 10

transicciones y animaciones en web

« en: 8 Octubre 2015, 12:23 pm »

Hola buenas tardes amigos,

Me gustaría crear una animacion en mi pagina web, sería lo siguiente, al pinchar en uno de los menus, por ejemplo:

mi menu consta de "home", "servicios",... etc. al pinchar en servicios te lleva a servicios.html, pues me gustaría que servicios apareciese con algun efecto, por ejemplo desde la izquierda.

He probado muchas maneras, con slideit etc... pero no me llegan a funcionar y las veo muy complejas.

¿Hay algun codigo que se pueda hacer mas sencillo? ¿Como me recomendais?

Gracias de antebrazo,

Saludos.


	En línea

#!drvy

Moderador

Desconectado

Mensajes: 5.850

Re: transicciones y animaciones en web

« Respuesta #1 en: 10 Octubre 2015, 11:55 am »

Sin código es difícil ayudarte. Hay una infinidad de plugins y scripts para hacer animaciones pero la mayoría se basan en javascript (cosa que ya no es recomendable). Deberías leer sobre animaciones y transiciones de CSS.

Saludos


	En línea

https://www.youtube.com/watch?v=oqKsrSXLR98

fernandorb10

Desconectado

Mensajes: 10

Re: transicciones y animaciones en web

« Respuesta #2 en: 11 Octubre 2015, 12:29 pm »

Buenas tardes,

Voy a concretarte un poco mas.

Código:


<nav id="nav" >
							<ul >
								
									<li class="current">
									<div class="nav2">	
									
										<a href="index.html">Home</a>
									</div>
									
									</li>

								
								<li ><a href="quienessomos.html"> ¿Quiénes somos?</a>
									
								</li>
								<li><a href="servicios.html">Servicios</a></li>
								<li><a href="right-sidebar.html">Partners</a></li>
								
								<li><a href="contacto.html">Contacto</a></li>
							</ul>
						</nav>

Este sería mi codigo, al pinchar en Servicios por ejemplo, te abre la pagina servicios.html, pues ahí es donde quiero que aparezca una animacion, transicion... o algo así que quede "friki"

Puedes ayudarme?

Saludos.


	En línea

viriatooundil

Desconectado

Mensajes: 3

Re: transicciones y animaciones en web

« Respuesta #3 en: 20 Octubre 2015, 13:51 pm »

Si quieres algo sencillo, usa jquery y con la libreria prueba esto:
(fijate que le he añadido un id al elemento a para simplificar y un iframe para la caga dinamica)

Código

$("#cosa").on("click",function(evt){
 
    evt.preventDefault(); // Necesario para que al pulsar no te mande directaamente
    url = this.getAttribute("src");
    iframe = $("#iframe");
    iframe.setAttribute("src",url);
    iframe.show(300);
)

Tendras que hacerle retoques, pero ahi tienes la base para desarrollar tu idea


« Última modificación: 20 Octubre 2015, 18:44 pm por #!drvy »	En línea

Páginas: [1]

Ir a:

Mensajes similares
	Asunto	Iniciado por	Respuestas	Vistas	Último mensaje
	ayuda animaciones Diseño Gráfico	Dannysoft	1	1,804	5 Diciembre 2004, 00:51 am por Karcsi
	Animaciones con Swish Diseño Gráfico	mkiii2003	0	1,682	13 Abril 2005, 23:41 pm por mkiii2003
	Juntar 2 animaciones en .fla Diseño Gráfico	Jericho	4	3,480	9 Septiembre 2005, 18:59 pm por Azielito
	Acerca de animaciones Multimedia	_Novato_	1	1,389	1 Diciembre 2005, 02:57 am por Error 404
	Animaciones en C++ Programación C/C++	Riki_89D	1	6,708	5 Noviembre 2010, 22:17 pm por Akai