Results 1 to 4 of 4

Thread: Support: Horizontal animated div collapse..

  1. #1
    Join Date
    Nov 2008
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Exclamation Support: Horizontal animated div collapse..

    1) Script Title: animatedcollapse.js, jquery-1.2.2.pack

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

    3) Describe problem: Hi, the script above provides an excellent support for collapsible div and I seek the similar effect in horizontal direction from left-to-right or right-to-left. Can somebody kindly help in this regards

    Kind Regards,
    S.

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

    Default

    There's no easy way to change the orientation of this script unfortunately. I know what you mean though, and it's a script I'll probably put up down the road.
    DD Admin

  3. #3
    Join Date
    Jul 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi there, been using DD since 98, and surprisingly this is my first post!

    Anyway, I've been using animatedcollapse a great deal. It's so flexible that I've found about a dozen different little uses for it, I especially like to nest divs within divs to create navs and subnavs with this script (now even better with the persistence option!).

    I too would like to be able to use it for horizontal collapsing.

    I changed the line:
    Code:
    var animateSetting={height: action}
    to
    Code:
    var animateSetting={width: action}
    Which works, for the most part, with one small glitch. Right after the div/s collapse there is a brief flash showing where the div once was, and I'm not sure how to fix this.

    Any advice?

  4. #4
    Join Date
    Jul 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Actually, I think I figured out what was causing the blinking... can't nest it in a list. No biggie.


    But, I've noticed that this squeezes the div (instead of hiding the off-run), and when there are multiple lines, it can look rather silly. To fix this you can put a div with a set width within the div that will be scaled.

    i.e.

    Code:
    <div id="animatedcollapsediv">
         <div style="width:100px;">multiple<br>lines<br>of<br>text....</div>
    </div>
    This keeps the text from jumping around as it is rescaled, but it would be nice if the script could natively do all this by default, without giving a specific width.

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
  •