Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #248137
    Glen Pavelich
    Participant

    When the site loads for the first time each visit the transition is jumpy as the slider etc load. Is there any way of smoothing this out?

    See: https://test.shields.ca/
    and watch for the flicking and resizing as the site loads.

    #248194
    Skandha
    Keymaster

    @fireflywebs: Hello there,
    Go to => Appearance => Customize => Additional CSS and add the following CSS Code.

    .slider-content-wrapper,
    .custom-header {
        -webkit-animation: fadein 2s;
        -moz-animation: fadein 2s;
        -ms-animation: fadein 2s;
        -o-animation: fadein 2s;
        animation: fadein 2s;
    }
    @keyframes fadein {
        from {
            opacity:0;
        }
        to {
            opacity:1;
        }
    }
    @-moz-keyframes fadein { /* Firefox */
        from {
            opacity:0;
        }
        to {
            opacity:1;
        }
    }
    @-webkit-keyframes fadein { /* Safari and Chrome */
        from {
            opacity:0;
        }
        to {
            opacity:1;
        }
    }
    @-o-keyframes fadein { /* Opera */
        from {
            opacity:0;
        }
        to {
            opacity: 1;
        }
    }

    Let me know if this solves your issue.
    Kind Regards,
    Skandha

    #248220
    Glen Pavelich
    Participant

    Seems to help yes. I also notice that a flip happens as the style sheet loads so the template defaults on the slider show for an brief instant. I don’t know that this is avoidable, but maybe there is something that prioritizes the style sheet that I don’t know about.

Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.