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

Home Forums CSS Fullscreen Not scrolling+scrolling

  • This topic is empty.
Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
  • #40468

    Hello all and Hello CSS-Tricks forums!

    Ugs, what a post title..

    Ok, I’m building a blog theme with a fullscreen image background in every post. [This]( “This”) is what i have so far.

    Now, when I click the archive button I want the Post+fullscreen image to scroll up (which i’ve done with jquery) to get to the posts overview. The overview thumbnails are displayed using masonry. But I need the overview page to be scrollable in order to see all posts there. I’d like to have the posts lazyloaded later. How can I get the overview page to be scrollable while the post page is not?

    Oh and basically I’m a newbie to all the markup stuff and i’m really inexperienced so maybe my code is well, not so good sometimes. I’d be glad for every hint i get to make things better.

    Thanks a lot in advance!

    Kitty Giraudel

    The problem comes from the fact thumbnails are absolutely positioned. This means they are out of the flow, and that’s why you can’t scroll down. Because, from the browser point of view, there is nothing to scroll.

    Taufik Nurrohman

    Just set the #container to be overflow:auto:

    #container {overflow:auto}

    Then, with JQuery, set the container height to be same with the window height:

    $(window).on("resize", function() {
    $('#container').css('height', $(this).height());

    tried it but can’t get it to work. I have no clue how to fix that..

    Maybe there is a way of doing this in CSS only except for the moving of the image?


    I got it to work by setting a fixed height to the container (500px) and overflow-y:scroll;
    But HugoGiraudel is right, I wouldn’t absolutely position those images.


    but isn’t absolute image positioning demanded by masonry? and how would I have to do it with relative positioning?

    Taufik Nurrohman

    oO wow! thank you Hompimpa. That looks fantastic.


    On a side note bogus, I would change that font color. You can hardly read it on that background.


    yeah it’s still a mockup and far from being final. thanks nonetheless JDS

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