- Posts: 123
- Thank you received: 0
Want to stop the image animation on load
-
paul1
Active member - Topic Author
- Member
Less
More
2 years 8 months ago #49059
by paul1
Want to stop the image animation on load was created by paul1
Hi Milos
Using Hot Swipe Carousel to show an image full width - initially a single image with more added as site develops.
How do I stop the animation/image resizing on load?
While I am asking, when the page is crolled down, the menu resizes (great). Where are the settings to change the colours?
Bairnsdalebowls.com.au
My thanks,
Paul
Using Hot Swipe Carousel to show an image full width - initially a single image with more added as site develops.
How do I stop the animation/image resizing on load?
While I am asking, when the page is crolled down, the menu resizes (great). Where are the settings to change the colours?
Bairnsdalebowls.com.au
My thanks,
Paul
Please Log in to join the conversation.
-
milos
Support Staff - Moderator
Less
More
- Posts: 6744
- Thank you received: 716
2 years 8 months ago #49061
by milos
Replied by milos on topic Want to stop the image animation on load
Hello,
To disable the carousel animation edit the template file /media/templates/site/billiards/css/custom.css and delete this:
In the same file, you can change the floating top row background color here:
Regards,
Milos
To disable the carousel animation edit the template file /media/templates/site/billiards/css/custom.css and delete this:
Code:
/* animation */
.hot_swipe_carousel_slides .gallery-cell.is-selected img {
animation-name: growslowly;
animation-fill-mode: both;
animation-duration: 5s;
}
.hot_swipe_carousel_slides .gallery-cell.is-selected .contents h2 {
animation-name: growfast;
animation-fill-mode: both;
animation-duration: 1.5s;
}
.hot_swipe_carousel_slides .gallery-cell.is-selected .contents p {
animation-name: growfast;
animation-fill-mode: both;
animation-duration: 1.5s;
animation-delay: 1s;
font-weight: 400;
}
@keyframes growslowly {
0% {
transform: scale(1.1);
}
100% {
transform: scale(1);
}
}
@keyframes growfast {
0% {
transform: scale(0);
}
30% {
transform: scale(0);
}
100% {
transform: scale(1);
}
}
In the same file, you can change the floating top row background color here:
Code:
.floating.topmenushow {
position: fixed !important;
background: #202b38 !important;
}
Regards,
Milos
Please Log in to join the conversation.
Time to create page: 0.148 seconds