Giter Club home page Giter Club logo

slider-jquery's Introduction

Mejorando el Slider - Un tutorial de jQuery

Este es el código fuente del tutorial de jQuery que dí el jueves 7 de Junio de 2012 en dos partes: primero el tutorial inicial en #mejorandola y luego una versión avanzada en #postmejorandola, el HangOut semanal que hacemos luego de Mejorandola.

Un poco de explicación de ambos ejemplos

Ejemplo simple

Aquí es donde programamos la versión más sencilla (simple.html), donde llegué a explicar la lógica detrás de la marquesina que estamos implementando, y ofrecí un pequeño ejemplo de su funcionamiento (que se puede ver en demostracion.html) aplicando la técnica de sliders que agregan elementos al final para hacer la transición más relajada.

Video : Plugin de jQuery parte 1

Ejemplo avanzado

En esta parte del tutorial, que se dió más tarde en Post Mejorando.la trabajamos el mismo concepto de marquesina, pero enfocados a la Programación Orientada a Objetos con Javascript, creando un objeto Slider que se encargue de la funcionalidad, y sobre este una capa de código jQuery que realize la unión entre los distintos elementos de la interfaz.

Además, ofrecimos algunas sugerencias en cuánto a buenas prácticas y un método para que nuestro código sea más extensible, tanto por nosotros o por otros programadores, exponiendo la API de nuestro objeto Slider al resto de la página, y dando soporte para funciones callback. Esto pueden encontrarlo en avanzado.html.

Video : Plugin de jQuery parte 2

Sorpresa final

Incluyo además dentro de js/sorpresa.js el código que utilicé al finalizar la charla de la parte avanzada, demostrando como es de sencillo extender o modificar la funcionalidad del objeto Slider y realizar variaciones en las animaciones de cada slide.

Si tienen dudas o comentarios, siempre pueden contactarse conmigo de varias formas:

No olviden de sintonizar Mejorando.la y Post Mejorando.la](http://post.mejorando.la) todos los jueves, así como dejar sus ideas para el Hangout o nuevas Tutorías.

slider-jquery's People

Contributors

prigazzi avatar

Stargazers

Willans Flores Casivanis avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.