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

Botón Mágico

Magic Button, es un botón animado para android bajo licencia del MIT desarrollado por Bloder (Brasil), el proyecto esta[...]

Migrar proyecto Netbeans a Eclipse

En ocasiones por motivos cualesquiera que sea queremos pasar proyectos hechos en netbeans a Eclipse, Netbeans cuenta con[...]

Crea tu propia plantilla de proyectos

En un post anterior [Crear plantillas personalizadas para Netbeans] vimos una forma sencilla que tiene Netbeans para fac[...]

Validar etiquetas facebook en standar w3c

Cuando se diseñan paginas web es recomendable hacer uso de standares como una de las buenas practicas de programación, p[...]

Como personalizar tus ToolTipText

Primeramente debemos saber que es un ToolTipText en Java, pues no es mas que esa información que se muestra cuando posic[...]

AutoDraw: App Inteligente de Google para adivinar lo que estas dibujando

Google acaba de lanzar AutoDraw, una aplicación que usa la Inteligencia Artificial para adivinar lo que intentas dibujar[...]