Skip to main content

Forums

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

  • This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #284636
    vulkanus
    Participant

    Hello,
    can you help me with css / js so that when the menu opens, in dropdown form the body of the page moves to the right and automatically adjusts to the window.
    At the moment I have some part of the code that does this instruction, however the images do not fit the container, and the imagens are dispersed from one another, in this images I´m using mansory/isotope (so if I resize the window 1px, the imagens adjust automatically).

    I´m using this js on click un toggle menu:
    function openNav() {
    document.getElementById(“main-navigation”).setAttribute(“style”,”margin-width:290px; transition:margin-left .2s; “);
    document.getElementById(“page”).setAttribute(“style”,”margin-left:290px; transition:margin-left .2s”);
    }

    resume:
    1 – at menu open, move “page” to right fit int windows browser size without create scrool;
    2 – Images resize automatically to the container windows size.

    I cannot give you a code-pen because the project is localhost.
    Thank you.

    #284988
    vulkanus
    Participant

    hi

    No One?

    #285029
    LearnTheNew
    Participant

    can you provide your query code with codepen link.

    #285097
    vulkanus
    Participant

    Hi @LearnTheNew

    can not, it’s a complex code.

    I analyzed it better and found that part of that mistake is something I lack in masonry. I have it set horizontally, but it lacks the vertical part. The masonry itself is fading well, because if we readjust the browser window, the images line up side by side without leaving a disproportionate margin.

    Do you have any clue?

    thank you

    #285499
    vulkanus
    Participant

    Hi,

    For those who need it, in my case, it was solved in this way, I have to add ImagesLoaded() function.

    $grid.imagesLoaded().progress( function() {
    $grid.masonry(‘layout’);
    });

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