Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript JQuery Hover Delayed Toggle Sequence

  • This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #32457
    AnonymousBlah
    Participant

    Hi, everyone! I’m not very good with JS/JQuery, so I need some help here…

    I have a page both vertically and horizontally centered. In this page I have a series of concentric circles, with a button in the centre.

    What I want to accomplish is the following:

    • The page loads with all circles hidden (easily done with css display:none;)
    • When the ‘button’ in the centre is hovered over, I want the circles to fade in – in order from smallest to largest
    • When the ‘button’ is moused out, I want the circles to fade out – in order from largest to smallest

    All of the circles are separate DIV elements, never overlapping each other.

    Please feel free to check the code, and edit it if you have a solution.

    Thanks, to anyone that helps!

    Screenshot: http://cl.ly/6CJR

    ALL CODE: http://cssdesk.com/cNeCx

    EDIT: Please view in Webkit!

    #49586
    AnonymousBlah
    Participant

    [SOLVED]

    Nevermind, I got an answer.
    If anyone’s interested, the solution’s over here: http://stackoverflow.com/questions/5767055/jquery-on-hover-delayed-toggle-sequence

Viewing 2 posts - 1 through 2 (of 2 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.