[Glen Pavelich]

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.

[Skandha]

@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

[Glen Pavelich]

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.

[Author]

Posts