{\rtf1\ansi\ansicpg1252\cocoartf1038\cocoasubrtf350
{\fonttbl\f0\fmodern\fcharset0 Courier;}
{\colortbl;\red255\green255\blue255;}
\margl1440\margr1440\vieww9000\viewh8400\viewkind0
\deftab720
\pard\pardeftab720\ql\qnatural

\f0\fs24 \cf0 /*\
 * Tutorial Easy slider\
 * Autor: Osiris Magro\
 * url: http://innominepixel.wordpress.com\
 * Fecha: 15/02/2010\
 * Comp\'c3\'a1rtelo como quieras\
 */\
\
$(document).ready(function()\{\
\
    /*\
     * Variables\
     */\
\
    var slides, slides1, slides2, slides3, timer1, timer2, timer3;\
\
    //Crea un objeto con informaci\'c3\'b3n de los slides\
    slides1 = $('#slider1 .slidesContainer > .slide');\
    slides2 = $('#slider2 .slidesContainer > .slide');\
    slides3 = $('#slider3 .slidesContainer > .slide');\
\
\
    /*\
     * Funciones\
     */\
    \
    //Desplaza el contenedor hacia la direcci\'c3\'b3n definida\
    //@direction = [left,right]\
\
    function sliderScroll3(direction)\{\
\
       //Calcula la posici\'c3\'b3n actual del contenedor\
       position3 = $('#slider3').scrollLeft();\
\
       //Calcula la anchura total menos el \'c3\'baltimo slide.\
       //Se usa para calcular cuando el scroll llega al final.\
       totalWidth3 = (slides3.length * slides3[0].offsetWidth) - slides3[0].offsetWidth\
\
       //Se comprueba la variable direction para hacer el scroll hacia izquierda o derecha\
       switch (direction) \{\
            case 'right': //Derecha\
                if (position3+slides3[0].offsetWidth > totalWidth3)\{ //Si la siguiente posici\'c3\'b3n se sale del contenedor, vuelve al principio.\
                    $('#slider3:not(:animated)').animate(\{scrollLeft:0\},1000);\
                \} else \{ //Si no es el final, suma a la posici\'c3\'b3n actual la anchura del slide.\
                    $('#slider3:not(:animated)').animate(\{scrollLeft:position3+slides3[0].offsetWidth\},1000);\
                \}\
                break;\
\
            case 'left': //Izquierda\
                if (position3-slides3[0].offsetWidth < 0)\{ //Si la siguiente posici\'c3\'b3n se sale del contenedor, vuelve al final.\
                    $('#slider3:not(:animated)').animate(\{scrollLeft:totalWidth3\},1000);\
                \} else \{ //Si no es el final, resta a la posici\'c3\'b3n actual la anchura del slide.\
                    $('#slider3:not(:animated)').animate(\{scrollLeft:position3-slides3[0].offsetWidth\},1000);\
                \}\
                break;\
        \}\
\
   \}\
\
\
    function sliderScroll1(direction)\{\
\
       //Calcula la posici\'c3\'b3n actual del contenedor\
       position1 = $('#slider1').scrollLeft();\
\
       //Calcula la anchura total menos el \'c3\'baltimo slide.\
       //Se usa para calcular cuando el scroll llega al final.\
       totalWidth1 = (slides1.length * slides1[0].offsetWidth) - slides1[0].offsetWidth\
\
       //Se comprueba la variable direction para hacer el scroll hacia izquierda o derecha\
       switch (direction) \{\
            case 'right': //Derecha\
                if (position1+slides1[0].offsetWidth > totalWidth1)\{ //Si la siguiente posici\'c3\'b3n se sale del contenedor, vuelve al principio.\
                    $('#slider1:not(:animated)').animate(\{scrollLeft:0\},1000);\
                \} else \{ //Si no es el final, suma a la posici\'c3\'b3n actual la anchura del slide.\
                    $('#slider1:not(:animated)').animate(\{scrollLeft:position1+slides1[0].offsetWidth\},1000);\
                \}\
                break;\
\
            case 'left': //Izquierda\
                if (position1-slides1[0].offsetWidth < 0)\{ //Si la siguiente posici\'c3\'b3n se sale del contenedor, vuelve al final.\
                    $('#slider1:not(:animated)').animate(\{scrollLeft:totalWidth1\},1000);\
                \} else \{ //Si no es el final, resta a la posici\'c3\'b3n actual la anchura del slide.\
                    $('#slider1:not(:animated)').animate(\{scrollLeft:position1-slides1[0].offsetWidth\},1000);\
                \}\
                break;\
        \}\
   \}\
\
   \
    function sliderScroll2(direction)\{\
\
       //Calcula la posici\'c3\'b3n actual del contenedor\
       position2 = $('#slider2').scrollLeft();\
\
       //Calcula la anchura total menos el \'c3\'baltimo slide.\
       //Se usa para calcular cuando el scroll llega al final.\
       totalWidth2 = (slides2.length * slides2[0].offsetWidth) - slides2[0].offsetWidth\
\
       //Se comprueba la variable direction para hacer el scroll hacia izquierda o derecha\
       switch (direction) \{\
            case 'right': //Derecha\
                if (position2+slides2[0].offsetWidth > totalWidth2)\{ //Si la siguiente posici\'c3\'b3n se sale del contenedor, vuelve al principio.\
                    $('#slider2:not(:animated)').animate(\{scrollLeft:0\},1000);\
                \} else \{ //Si no es el final, suma a la posici\'c3\'b3n actual la anchura del slide.\
                    $('#slider2:not(:animated)').animate(\{scrollLeft:position2+slides2[0].offsetWidth\},1000);\
                \}\
                break;\
\
            case 'left': //Izquierda\
                if (position2-slides2[0].offsetWidth < 0)\{ //Si la siguiente posici\'c3\'b3n se sale del contenedor, vuelve al final.\
                    $('#slider2:not(:animated)').animate(\{scrollLeft:totalWidth2\},1000);\
                \} else \{ //Si no es el final, resta a la posici\'c3\'b3n actual la anchura del slide.\
                    $('#slider2:not(:animated)').animate(\{scrollLeft:position2-slides2[0].offsetWidth\},1000);\
                \}\
                break;\
        \}\
\
   \}\
   \
\
   //Funci\'c3\'b3n que crea el temporizador\
   function initTimer1()\{\
        timer1 = setInterval(function()\{sliderScroll1('right');\}, 3000);\
   \}\
   function initTimer2()\{\
        timer2 = setInterval(function()\{sliderScroll2('right');\}, 3000);\
   \}\
   function initTimer3()\{\
        timer3 = setInterval(function()\{sliderScroll3('right');\}, 3000);\
   \}\
\
\
   /*\
    * C\'c3\'b3digo\
    */\
\
    //Asigna el ancho total de los slides al contenedor\
    //La anchura total se obtiene multiplicando la medida de un slide por el n\'c3\'bamero de slides)\
    $('#slider1 .slidesContainer').css('width',slides1[0].offsetWidth * slides1.length);\
    $('#slider2 .slidesContainer').css('width',slides2[0].offsetWidth * slides2.length);\
    $('#slider3 .slidesContainer').css('width',slides3[0].offsetWidth * slides3.length);\
\
\
    //Click en el bot\'c3\'b3n "next"\
    $('#slider1').mouseover(function()\{\
        clearInterval(timer1); //Desactiva el temporizador\
        sliderScroll1('right'); //Mueve el scroll a la derecha\
        initTimer1(); //Vuelve a activar el temporizador\
        return false;\
    \});\
	\
	\
	   $('#slider1').mouseout(function()\{\
        clearInterval(timer1); //Desactiva el temporizador\
        sliderScroll1('right'); //Mueve el scroll a la derecha\
        return false;\
    \});\
\
	\
    //Click en el bot\'c3\'b3n "next"\
    $('#imgsilder1').mouseover(function()\{\
        clearInterval(timer1); //Desactiva el temporizador\
        sliderScroll1('right'); //Mueve el scroll a la derecha\
        initTimer1(); //Vuelve a activar el temporizador\
        return false;\
    \});\
	\
	\
	   $('#imgsilder1').mouseout(function()\{\
        clearInterval(timer1); //Desactiva el temporizador\
        sliderScroll1('right'); //Mueve el scroll a la derecha\
        return false;\
    \});\
\
\
    //Click en el bot\'c3\'b3n "prev"\
    $('.prev').click(function()\{\
        clearInterval(timer1); //Desactiva el temporizador\
        sliderScroll1('left'); //Mueve el scroll a la izquierda\
        initTimer1(); //Vuelve a activar el temporizador\
        return false;\
    \});\
\
   \
    //Click en el bot\'c3\'b3n "next"\
    $('#slider2').mouseover(function()\{\
        clearInterval(timer2); //Desactiva el temporizador\
        sliderScroll2('right'); //Mueve el scroll a la derecha\
        initTimer2(); //Vuelve a activar el temporizador\
        return false;\
    \});\
	\
	\
	   $('#slider2').mouseout(function()\{\
        clearInterval(timer2); //Desactiva el temporizador\
        sliderScroll2('right'); //Mueve el scroll a la derecha\
        return false;\
    \});\
\
\
    //Click en el bot\'c3\'b3n "next"\
    $('#imgsilder2').mouseover(function()\{\
        clearInterval(timer2); //Desactiva el temporizador\
        sliderScroll2('right'); //Mueve el scroll a la derecha\
        initTimer2(); //Vuelve a activar el temporizador\
        return false;\
    \});\
	\
	\
	   $('#imgsilder2').mouseout(function()\{\
        clearInterval(timer2); //Desactiva el temporizador\
        sliderScroll2('right'); //Mueve el scroll a la derecha\
        return false;\
    \});\
\
\
   \
    //Click en el bot\'c3\'b3n "next"\
    $('#slider3').mouseover(function()\{\
        clearInterval(timer3); //Desactiva el temporizador\
        sliderScroll3('right'); //Mueve el scroll a la derecha\
        initTimer3(); //Vuelve a activar el temporizador\
        return false;\
    \});\
	\
	\
	   $('#slider3').mouseout(function()\{\
        clearInterval(timer3); //Desactiva el temporizador\
        sliderScroll3('right'); //Mueve el scroll a la derecha\
        return false;\
    \});\
\
    //Click en el bot\'c3\'b3n "next"\
    $('#imgsilder3').mouseover(function()\{\
        clearInterval(timer3); //Desactiva el temporizador\
        sliderScroll3('right'); //Mueve el scroll a la derecha\
        initTimer3(); //Vuelve a activar el temporizador\
        return false;\
    \});\
	\
	\
	   $('#imgsilder3').mouseout(function()\{\
        clearInterval(timer3); //Desactiva el temporizador\
        sliderScroll3('right'); //Mueve el scroll a la derecha\
        return false;\
    \});\
\
\
   \
\
\});\
}