Tagged: ,

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #718955

    My home page http://dev.solace.com includes 3 masonry galleries that are loading very delayed and slowly. I’d rather just have the elements load as part of the page instead of when you scroll. Can you please provide the code that will do this?

    I found a few threads about this topic, but they’re a messy mishmash of overlapping suggestions that didn’t work for me.

    #718966

    Hi JeeBar!

    You want to have the loading been before the page load?
    Have you installed and tryed and cache plugin together with lazy load?

    Let me know if I did not understood you properly.

    Thanks a lot

    Regards,
    Basilis

    #718977

    No, I don’t care about when they load to that level of detail — I just want the masonry galleries to load along with the rest of the page, instead of only popping into existence when you scroll down to that section. Because right now they don’t appear until you scroll down to them, and there’s a 2-3 second delay even when you do, so it looks like the page is blank and people are noticing/complaining.

    #720287

    Hi,

    Please add this css code in the Quick CSS field.

    .avia_desktop.avia_transform3d .av-masonry-entry.av-masonry-item-loaded .av-inner-masonry {
        -webkit-animation: none !important;
        animation: none !important;
    }

    Best regards,
    Ismael

    #720392

    Hmm. Better. Kinda. Different anyway, but not what I really want though.

    The galleries still aren’t loading as part of the initial page load. http://dev.solace.com/

    They only load when you scroll to that section. Only difference this made is that now the elements “appear” one at a time (pop pop pop pop) and quickly instead of zooming in one at a time after a brief delay.
    I really do just want these galleries to load automatically as part for the page loading.

    #721774

    Hi,

    Please add this css codes:

    .av-masonry-entry {
        opacity: 1 !important;
        visibility: visible !important;
    }
    
    .avia_sortable_active .isotope {
        -webkit-transition: none;
        transition: none;
    }

    Best regards,
    Ismael

    #722638

    Sigh. Thanks but no. That didn’t do it either. No discernible difference in behavior.
    The images are still not loading until you scroll to that section of the page.

    Here’s the sum total of the CSS I’ve got now:

    /* make it so masonry galleries load with page instead of as you scroll to them */
    .avia_desktop.avia_transform3d .av-masonry-entry.av-masonry-item-loaded .av-inner-masonry {
        -webkit-animation: none !important;
        animation: none !important;
    }
    .av-masonry-entry.av-masonry-item-loaded {
        opacity: 1 !important;
        visibility: visible !important;
    }
    .avia_sortable_active .isotope {
        -webkit-transition: none;
        transition: none;
    }
    #723613

    Hi!

    My bad. I forgot to remove the “.av-masonry-item-loaded” selector in the css declaration above. This selector is added to the masonry items, one at a time, so it creates a “delay” effect. Please try the code again.

    .av-masonry-entry {
        opacity: 1 !important;
        visibility: visible !important;
    }
    
    .avia_sortable_active .isotope {
        -webkit-transition: none;
        transition: none;
    }

    Cheers!
    Ismael

    #723916

    OK, we’re getting close.
    Now the items in the gallery load along with the page, which is nice.
    But when you scroll down to where they are, they animate in place.

    #724896

    Hi,

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

    .avia_desktop.avia_transform3d .av-masonry-entry.av-masonry-item-loaded .av-inner-masonry {
        -webkit-animation: none !important;
        animation: none !important;
    }
    

    Best regards,
    Yigit

    #724986

    OK, it seems that i have a caching issue, and this has in fact addressed the issue even though I myself still see them animate in my main browser.

    #724989

    Hi!

    We are happy you could solve it.
    Please feel free to let us know if we can do anything else for you, by creating a new ticket.

    Thanks a lot

    Regards,
    Basilis

Viewing 12 posts - 1 through 12 (of 12 total)
  • The topic ‘Disable Loading Animation of Masonry’ is closed to new replies.