Layer animation problems


DevX Home    Today's Headlines   Articles Archive   Tip Bank   Forums   

Results 1 to 2 of 2

Thread: Layer animation problems

  1. #1
    MusoSpuso Guest

    Layer animation problems


    Basically I have a set of links on my site. When someone clicks on the link
    a onMouseDown handler is called which executes two functions. The first is
    to animate a side panel off the screen and animate a new one to correspond
    to the link that was pressed.
    Everything works fine till someone decides to go nuts and start clicking
    links one after the other before the animation can be completed. In other
    words when someone clicks on say the news link, a page will load in an iframe
    in the middle and to the side the old panel (whichever it happens to be)
    will swing off and the news panel will swing in. When they then click on
    say the members link, the news panel will then swish away and the members
    panel will come on (and the members page will load in the iframe etc.).
    So basically I need to know how to get javascript to NOT execute any animation
    commands until the previous one is done. However, I've tried this in a variety
    of ways using flag variables and such and it just doesn't work because javascript
    seems to execute code in parallel, like in my case it'll try and execute
    multiple animation functions if the user clicks on the links while the previous
    animation function is trying to complete it'll just start an new process
    anyway!
    Any ideas? For instance, does anyone know how to turn off the onClick handler
    while the animation functions are in process?

    Thanks, any help will be greatly apreciated!

  2. #2
    DT Guest

    Re: Layer animation problems


    Why re-invent the wheel? Their is a great tutorial on this at Dan Steinmans
    "Dynamic Duo" website. You have to track what panels(iframes)are currently
    out. Tracking an objects positioning state in animated DHTML is a basic.
    Anyhow all the anwsers are their and the code as well. I have been enjoying
    the very same you are talking about for about a year and a half now. Enjoy.

    -DT

    "MusoSpuso" <sbi@hotmail.com> wrote:
    >
    > Basically I have a set of links on my site. When someone clicks on the

    link
    >a onMouseDown handler is called which executes two functions. The first

    is
    >to animate a side panel off the screen and animate a new one to correspond
    >to the link that was pressed.
    > Everything works fine till someone decides to go nuts and start clicking
    >links one after the other before the animation can be completed. In other
    >words when someone clicks on say the news link, a page will load in an iframe
    >in the middle and to the side the old panel (whichever it happens to be)
    >will swing off and the news panel will swing in. When they then click on
    >say the members link, the news panel will then swish away and the members
    >panel will come on (and the members page will load in the iframe etc.).


    > So basically I need to know how to get javascript to NOT execute any animation
    >commands until the previous one is done. However, I've tried this in a variety
    >of ways using flag variables and such and it just doesn't work because javascript
    >seems to execute code in parallel, like in my case it'll try and execute
    >multiple animation functions if the user clicks on the links while the previous
    >animation function is trying to complete it'll just start an new process
    >anyway!
    > Any ideas? For instance, does anyone know how to turn off the onClick

    handler
    >while the animation functions are in process?
    >
    >Thanks, any help will be greatly apreciated!



Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center
 
 
FAQ
Latest Articles
Java
.NET
XML
Database
Enterprise
Questions? Contact us.
C++
Web Development
Wireless
Latest Tips
Open Source


   Development Centers

   -- Android Development Center
   -- Cloud Development Project Center
   -- HTML5 Development Center
   -- Windows Mobile Development Center