Disable Main page Animation..

[neoark]

Hello,

I am trying to increase load time for the site. Is there a way to disable animation on the main page. It just adds a delay when loading the website on the slow internet.

Thanks

 

[Rodolfo]

You can't disable al that and if speed is your concern then use just one image.

 

[SMP]

Or totally disable or remove the image.

 

[bee]

use just one image

Also with only one image, the animation is active.

 

[Rodolfo]

Is active but the animation doesn't affect the load time. Load time is affected by how many elements you load into the page, not animations.

 

[zjmw00]

For anyone else that might want to disable animation, here's a hacky way to do it, but it works.

In app/themes/Peafowl/style.css:

(Around line 1232)
.home-cover-img {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-size: cover; <-- remove this line completely or comment it out with /* code */
background-repeat: no-repeat;
background-position: center center;
display: block;
opacity: 0;
-webkit-transform: translateZ(0);
backface-visibility: hidden;
}

(Around line 1257)
.home-cover-img.animate-end {
opacity: 1;
transform: scale(1.12); <--- change to (1)
animation: none;
}

@keyframes slideshow {
0% {
opacity: 0;
}
20% {
opacity: 1;
}
100% {
opacity: 1;
transform: scale(1.12); <--- change to (1)
}
}
@keyframes slideshow--alt {
100% {
transform: scale(1.12); <--- change to (1)
}
}

 

[Vortex]

For anyone else that might want to disable animation, here's a hacky way to do it, but it works.

instead of editing files, just use this as custom css. worked fine for me 🙂

.home-cover-img.animate-end {
transform: scale(1);
}
@keyframes slideshow {
0% {
opacity: 0;
}
20% {
opacity: 1;
}
100% {
opacity: 1;
transform: scale(1);
}
}
@keyframes slideshow--alt {
100% {
transform: scale(1);
}
}

 

[Focker]

instead of editing files, just use this as custum css. worked fine for me

Where do you put it?

 

[tomsit]

Where do you put it?

admin dashboard -> settings -> theme (scroll down and paste in custom css section)

 

[Focker]

admin dashboard -> settings -> theme (scroll down and paste in custom css section)

Thank you.