Aprende Java Aprende Php Aprende C++ Aprende HTML 5 Aprende JavaScript Aprende JSON Aprende MySQL Aprende SQLServer Aprende Visual Basic 6 Aprende PostgreSQL Aprende SQLite Aprende Redis Aprende Kotlin Aprende XML Aprende Linux VSC Aprende Wordpress Aprende Laravel Aprende VueJS Aprende JQuery Aprende Bootstrap Aprende Netbeans Aprende Android
Sigueme en Facebook Sigueme en Twitter Sigueme en Instagram Sigueme en Youtube Sigueme en TikTok Sigueme en Whatsapp
Home / Desarrollo Web / Crear animaciones con JQuery y Spritely

Crear animaciones con JQuery y Spritely

Por jc mouse miércoles, julio 4, 2012

Spritely es un plugin para JQuery que te permite crear animaciones con puro javascript y así no tener que utilizar flash, aún esta en fase de desarrollo y le falta mucho para competir con flash, pero no por eso deja de ser una buena opción para animar páginas web sin tener que recurrir a flash.

Soporta varios navegadores incluido el IE, esta en la versión 0.6.1 y no pesa nada, trabaja bajo la licencia «Dual licensed under the MIT or GPL Version 2 licenses.» 

Para animar un banner con un movimiento, basta unas cuantas lineas de código:

<style type="text/css" media="screen">
<!--
#mi_div {
 height: 100px;
 width: 270px; 
 background: transparent url(../images/banner.png) 0 0 repeat-x;
}
-->
</style>

<div id="mi_div"></div>

<script type="text/javascript">
(function($) {
  $(document).ready(function() {  
     $('#mi_div').pan({fps: 30, speed: 0.5, dir: 'left'});  
  });  
})(jQuery);
</script>

Spritely también soporta animación de sprites, para añadir más dinamismo a las páginas web, puedes encontrar mas información en su pagina en ingles de Spritely. Ademas cuenta con muchos ejemplos bastante fáciles de entender

🙂

Tags

Artículos similares

Animación con sprites y LibGDX

En este post veremos una pequeña introducción a lo que son las animaciones con LibGDX y el uso de sprites. ¿Que es la an[...]

ANSI: Colorear consola de salida de Netbeans

Cuando realizamos proyectos java desde Netbeans, usamos System.out.println para imprimir datos en consola (para dep[...]

Genera Gráficos Profesionales Gratis y en Segundos con MakeGraph.app

Si necesitas de graficos estadisticos y Excel no es tu fuerte o no te gusta el estilo que tiene, MakeGraph.app es una bu[...]

Mapas interactivos con HTML5 – Parte 1

La tecnología de HTML5 y javascript  nos permite crear gráficos interactivos livianos sin tener que recurrir a flash, el[...]

Efecto de explosión al abrir un JPanel

En este tutorial crearemos un interesante efecto de explosión al momento de abrir un JPanel, este efecto puede extenders[...]

Introducción a Python en Java

Python es un lenguaje de programación interpretado,  de programación multiparadigma, ya que soporta orientación a objeto[...]