[Rontice]

As in the title I have difficulties with this one.. any idea why opacity for said elements could not animate but just “jump” to a value at the end of the animation?

When I change the page by clicking either one of the nav menu items or the side-bar-like navigation it works fine despite not animating their opacity which looks kinda hectic.

Website is not live yet so sorry for no link!

[serkan]

Hi Rontice,
Please let me know when the link is online. Then I can help you more.

[Rontice]

Hi Serkan,

thanks for the fast response, the website is online now. You can find it here

I have checked the latest FF and Chrome, both have the issue.

PS: Before you wonder this is linked to the issue… I have also applied following styles, so it’s intended that after changing the page the not-current sections are hidden completely.. I found them to be irritating but wanted to keep that slick menu!


.vs-triplelayout .wrapper > section {
opacity: 0;
}

.vs-triplelayout .wrapper .vs-current {
opacity: 1;
}


[ahmetsali]

Hi, i see what you mean, but since the .vs-current class is being removed after the sliding animation ended, it is not possible to have current page animated both sliding of the screen and opacity to 0 at the same time, but you can make the current page faded out after the sliding animation ended by editing your code;

.vs-triplelayout .wrapper>section {
    opacity: 0;
    -webkit-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
.vs-triplelayout .wrapper .vs-current {
   opacity: 1; 
   }

[Rontice]

Hi, been in some stress lately.. will try it out, thanks!

[serkan]

You’re welcome, please don’t forget to rate the theme on themeforest if you liked it, thanks.