Results 1 to 3 of 3

Thread: Accordion menu opens very fast suddenly

  1. #1
    Join Date
    Oct 2007
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Unhappy Accordion menu opens very fast suddenly

    1) Script Title: Accordion Menu script

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...ordionmenu.htm

    3) Describe problem:
    It's not a real problem, though i'm a bit annoyed about a behaviour of this menu.
    I'm using this accordion for content and not as a menu.
    In the demo, when a button is clicked and about to expand, it slides smoothly.
    But when i have a larger amount with content in it, the accordion slides smoothly for a number of pixels in height and then suddenly it just collaps open without a smooth sliding effect anymore. Is there some kind of variable to change this so the slide of the accordion is always running smoothly till it's fully opened?
    When you click on an active button (the one that is allready open) the closing slide is smoothly all the time, from the bottom all the way up till it's closed. It's only when the accordion opens. Why is that? I really would like to have the same smooth behaviour.

    To see what i mean you can have a look in here:
    http://www.studio25.nl/accordion/

    - Second question is, i have a similar menu structure and this one has a nice bouncing effect when you click to open a button.
    Is it possible to have such effect with the script mentioned above?
    I thought the menu with the bouncing effect is based on jQuery.
    To see the bouncing effect live you can take a look in here:
    http://www.automaticmusic.nl/test/

    Thanks.
    Dave.
    Last edited by D72; 04-03-2008 at 12:45 PM. Reason: Forgot to ask another issue / feature regarding this accordion

  2. #2
    Join Date
    Aug 2004
    Posts
    10,143
    Thanks
    3
    Thanked 1,008 Times in 993 Posts
    Blog Entries
    16

    Default

    From what I can gather, the problem is due to the fact that you're limiting the width of your Accordion Content to a specific width:

    Code:
    .arrowlistmenu{
    width: 400px; /*width of accordion menu*/
    }
    Normally this is fine, but in this case with your contents containing a lot of text, some long words that don't line break well, it causes the jolting effect at the very end of the animation you see. If you remove the above from your CSS, you see the issue disappearing.

    Regarding your second question, I may add additional animation behaviors to this script similar to the one you referenced, but right now, there's no quick way to do that.

  3. #3
    Join Date
    Oct 2007
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks ddAdmin!
    As you mentioned it was a problem of the customized div around and in the accordion i tried something.
    In the first place i had myy style sheets something like:

    #content {
    width:400px;
    margin:0 auto;
    }

    p {
    margin:5px 10px;
    padding:0;
    text-align:justify;
    line-height:normal;
    }


    Now i've checked if it does make any difference when i wrap an extra div around my paragraph.
    So i changed it to this:

    #content {
    width:400px;
    margin:0 auto;
    }

    .text{
    background:#FFF;
    width:400px;
    margin:0;
    padding:0;
    }

    p {
    margin:0;
    padding:10px;
    text-align:justify;
    line-height:normal;
    }


    And now it's running smoothly.
    Thanks for pointing me to this.
    I thought in the first place it was something of an height setting in the accordion it self. I'm glad i could be easily solved by css.

    Thank you!

    Dave.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •