Pulsante di Scroll con effetto "ease"

[chaosmonger]

Ciao a tutti.
Ho un menu a scroll di immagini, azionato da due frecce (UP e DOWN), funziona bene, ma vorrei renderlo più raffinato con un effetto di "ease in" e "ease out" all roll_over e roll_out del mouse. Qualcuno sa come fare?

il menu potete vederlo da qui:

chaos08_video


e questo è il codice usato:

btnUp.addEventListener(MouseEvent.MOUSE_OVER, BUTUP);
btnUp.addEventListener(MouseEvent.MOUSE_OUT, stopBUTUP);
btnDown.addEventListener(MouseEvent.MOUSE_OVER, BUTDOWN);
btnDown.addEventListener(MouseEvent.MOUSE_OUT, stopBUTDOWN);
btnUp.addEventListener(Event.ENTER_FRAME, BUTUP);
btnDown.addEventListener(Event.ENTER_FRAME, BUTDOWN);

contentMain.addEventListener(Event.ENTER_FRAME, skrolldown);
contentMain.addEventListener(Event.ENTER_FRAME, skrollup);

var scrolldown:Boolean=false;
var scrollup:Boolean=false;

import flash.events.Event;

    var scrollHeight:Number = 460;
    var contentHeight:Number = contentMain.height;
    var maskHeight:Number = maskedView.height;
    var initContentPos:Number = contentMain.y;
    var finalContentPos:Number = maskHeight-contentHeight+initContentPos;
    var speed:Number = 5;

    
    function BUTUP(event:MouseEvent):void
    {
        scrollup=true;
    }
        
    function stopBUTUP(event:MouseEvent):void
    {
        scrollup=false;
    }
    
    function skrollup (evt:Event):void
        {
            if(scrollup)
            {
                if (contentMain.y+speed<maskedView.y) {
                    btnDown.visible = true;
                    contentMain.y += speed;}
                else {
                btnUp.visible = false;
                contentMain.y = maskedView.y;}
            }
        }

    function BUTDOWN(event:MouseEvent):void
    {
        scrolldown=true;
    }
    
    function stopBUTDOWN(event:MouseEvent):void
    {
        scrolldown=false;
    }
        
    function skrolldown (evt:Event):void
        {
            if(scrolldown)
            {
                if (contentMain.y-speed>finalContentPos) {
                    btnUp.visible = true;
                    contentMain.y -= speed;}
                else {
                    btnDown.visible = false;
                    contentMain.y = finalContentPos;}
            }
        }
            
    
    
if (contentMain.y==0) {
        btnUp.visible = false;
    }

Help! Help!

[chaosmonger]

Nessuno sa aiutarmi?

[Flep]

Ciao

Personalmente userei la Tweener caurina.
Trovi un esempio quì:

Tweener caurina di Zeh Fernando - tutorial 1

[chaosmonger]

Ci ho provato con la caurina, ma non riesco a gestirla bene... nel senso che quando clicco (o vado in rollover) me la fa partire fino alla fine, e non riesco a stopparla con un ease nel momento in cui o non premo più o vado in rollout...

suggerimenti?

[Flep]

Il fatto è che muovendo lo scroller in base al MOUSE_OVER, non hai un parametro variabile. Cioè ad esempio non muovi lo scroller in base alla y del mouse. Quindi ti ritrovi col mouse fermo e non hai valori variabili a cui associare ad esempio una inerzia o una accelerazione.

Potresti aggiungere una lieve inerzia al MOUSE_OVER e al MOUSE_OUT ma diventa quasi impercettibile, forse sul MOUSE_OUT si vedrebbe di più.

Se alleghi il FLA faccio delle prove.

[chaosmonger]

Grazie mille della disponibilità...
Puoi scaricare il .fla da questo link:

http://www.chaosmonger.com/chaos08_videoTEST.zip

[Flep]

Una cosa del genere.

Prova a modificare i tempi dei caurina ( adesso sono a 0.5 ).

[chaosmonger]

mmmm in realtà non è quello che avevo esattamente in testa io...
tra l'altro se arrivo in cima o in basso il tweener continua nel vuoto!

Cercavo qualcosa simile a questo sito

Animal Logic

Prova a cliccare le freccette in basso a destra per scorrere le immagini della sezione COMMERCIALS.

Lì c'è sia un'accelerazione in base a quanto tengo premuto, sia nel momento in cui stacco un progressivo rallentamento fino a fermarsi. Invece nella tua prova nel momento in cui stacco c'è una tweener che prende un'accelerazione e poi si ferma dopo Y pixel...

Il fatto è che non c'è una barra di scorrimento, ma solo i due tasti, però volendo forse una soluzione potrebbe essere quella di creare un MC invisibile che scorre in una linea invisibile lunga come tutto il campo Y dove sono contenute le icone, e di volta in volta comunica la propria posizione ai due pulsanti... boh!!!

Tu che dici?

[Flep]

Riposta il link perchè non funziona

[chaosmonger]

lo metto come testo:

www.animallogic.com/#Our%20Work,Commercials

ora dovrebbe andare...