Joomla Templates Club 406,261 posts

[Henning Friend HenningJoin date: February 2012Posts: 69Downloads:45Uploads:9 Thanks: 40 Thanked: 9 times in 1 posts]

#207885

Hi Guys,

I’m trying to change the animation of ‘Style 3’ to that of ‘Style 1’ on the JA ACM Slideshow. The next image should fade in like that of Style 1, currently it only slides the image from left to right.

I would appreciate it if you can point me in right direction.

Regards,
Henning

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#575761

Hi Henning,

I tried to install Uber template in my local, then change JA ACM Slideshow from style-3 to style-1 but it still slides correctly.

Pls take a backup of your site and make sure that you have last version for this module.

If there is still no go, you can PM me your site’s login info, I will take a look

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#642090

Hi Henning,

I tried to install Uber template in my local, then change JA ACM Slideshow from style-3 to style-1 but it still slides correctly.

Pls take a backup of your site and make sure that you have last version for this module.

If there is still no go, you can PM me your site’s login info, I will take a look

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#740750

Hi Henning,

I tried to install Uber template in my local, then change JA ACM Slideshow from style-3 to style-1 but it still slides correctly.

Pls take a backup of your site and make sure that you have last version for this module.

If there is still no go, you can PM me your site’s login info, I will take a look

[Henning Friend HenningJoin date: February 2012Posts: 69Downloads:45Uploads:9 Thanks: 40 Thanked: 9 times in 1 posts]

#575983

Hi Saguaros,

I am able to change from styles, however I would like to have style 3 to have the animation of Style 1, the image should fade in like on style 1. Only the animation not the styling. I am using the latest version of JA ACM.

Regards,
Henning

[Henning Friend HenningJoin date: February 2012Posts: 69Downloads:45Uploads:9 Thanks: 40 Thanked: 9 times in 1 posts]

#642311

Hi Saguaros,

I am able to change from styles, however I would like to have style 3 to have the animation of Style 1, the image should fade in like on style 1. Only the animation not the styling. I am using the latest version of JA ACM.

Regards,
Henning

[Henning Friend HenningJoin date: February 2012Posts: 69Downloads:45Uploads:9 Thanks: 40 Thanked: 9 times in 1 posts]

#740970

Hi Saguaros,

I am able to change from styles, however I would like to have style 3 to have the animation of Style 1, the image should fade in like on style 1. Only the animation not the styling. I am using the latest version of JA ACM.

Regards,
Henning

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#576084

You can try with this tweak:
– Go to file: root/templates/uber/acm/container-slideshow/css/style.css
– At approx line 151, you will see this css rule:


.acm-container-slide.slide-3 .carousel-inner > .item {
-webkit-transition: left 400ms;
-o-transition: left 400ms;
transition: left 400ms;
}


Replace with:


.acm-container-slide.slide-3 .carousel-inner > .item {
transition-property: opacity;
}


2 users say Thank You to Saguaros for this useful post

1. Henning
2. OAM

[Henning Friend HenningJoin date: February 2012Posts: 69Downloads:45Uploads:9 Thanks: 40 Thanked: 9 times in 1 posts]

#576094

Hi Saguaros,

Works perfectly, thanks a lot! I Was wondering if you can help me with the fade duration. I’m trying to have my Slideshow look like the following site; http://www.africaspeedrail.com/.

Thanks in advance,
Henning

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#576198

It’s about CSS3 transition, you can add transition property for it:

.acm-container-slide.slide-3 .carousel-inner > .item {
transition-property: opacity;
transition: left 3000ms;
}

http://www.w3schools.com/css/css3_transitions.asp

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#642524

It’s about CSS3 transition, you can add transition property for it:

.acm-container-slide.slide-3 .carousel-inner > .item {
transition-property: opacity;
transition: left 3000ms;
}

http://www.w3schools.com/css/css3_transitions.asp

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#741183

It’s about CSS3 transition, you can add transition property for it:

.acm-container-slide.slide-3 .carousel-inner > .item {
transition-property: opacity;
transition: left 3000ms;
}

http://www.w3schools.com/css/css3_transitions.asp

[Author]

Posts