Forums

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

Home Forums JavaScript Flexible Tile Layout

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #39588

    I am creating a template for a blog and in this template I am going to be laying out the posts in a windows 8-esk fashion.

    Example: http://s10.postimage.org/6qd18bou1/Metro_Tile_Navigation_Test_Correct.png

    Now the problem I am running into is trying to figure out how to make it work the way i want it to.

    The way I want it to work is all post except posts with images will be displayed in a 1×1 tile and posts with images will be displayed in a 2×2 tile.(1×1 tile is = to 243px X 243px). When you click on a 1×1 tile it will then turn into a 1×2 tile and display an excerpt of the post which would cause the rest of the tiles adapt. Also the initial layout the tiles have to be dynamic since there will be no certain order of the sizes of tiles they will be displayed newest to oldest.

    Can anyone help or point me in the right direction? This will be something I could put on CodePen after I get it working correctly.

    #109472
    chrisburton
    Participant

    Take a look at Naomi Atkinson’s site that uses Masonry.js.

    #109473
    Paulie_D
    Member

    Perhaps you might like to get started in Codepen?

    You might want to look into masonry.js

    Oh…snap

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