SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Member
    Join Date
    Oct 2011
    Posts
    21
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Problems with dynamical content height with scrolldeck.js

    Hello everyone,

    I'm trying to build a single page website with some parallax effect by using scrolldeck.js, and i've added accordion content to the "Slide" (you can call it "section"). The problem that i had was when i expanded (by user click) the content the height of the "slide" does not expand based on the content inside. And what i've found was each sections height has been calculated and assigned when the page was loaded and does not trigger when there are more content insides. If anyone could give me some advices on how that could be fix that will be very appreciate.

    Please check the following link for references:
    http://jsfiddle.net/HMk3Q/

    Thank you

  2. #2
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,657
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    That's a small height adjust. Just give the container more bottom padding

  3. #3
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,657
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    Or the element below it more top padding

  4. #4
    SitePoint Member
    Join Date
    Oct 2011
    Posts
    21
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello Eric,

    Thanks for your feedback and advices. I've tried adding paddings to the bottom before and it doesn't resolve the problem. Because the content's height doesn't dynamically change it's variable as it was defined as a fixed height at the first place (i assume). So it's still partly hidden when some other content was expanded.


  5. #5
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,208
    Mentioned
    456 Post(s)
    Tagged
    8 Thread(s)
    It's better to edit the JS if it is doing things you don't want, but that's not always easy with these third party scripts. As an alternative, you could make a brute force change to the CSS with something like this:

    Code:
    #why-jo {position: static !important; height: auto !important;}
    #about {position: static !important; top: auto !important;}
    Bit of a shame to have to do it that way, though.


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
  •