waschbaer__

well not the whole project, but the old sort of structure with 3 slides 2 animations ( although the completly show the same and to the same atm but thats jsut for showing the issue ) its the codepen at the top

visibility hidden, sadly didnt work at all im currently tryin to rebuild the page to fit the style that mikel suggested with his example

yea i thought about the same, that maybe the from to is the issue and a .to moving the object from out of view with opacity 0 , and the set start position in css might work better.. completly rebuilding everything takes time that we dont have -.-...but ill try it anyways as it looks atleast doable unless we get other complications along the way

i essentially just have one function for a fade in , that gets called multiple times once a scene is in the viewport via $('classname that we are using').each(function(){ problem is that every time we slide to the next slide, the content that gets faded in is shown completly visible and then the animation triggers, making it invisible how it should have been from the beginning and fading it in .

you can see the error in the codepen up top , notice how the second slide containting the same stuff is fully visible and only when the animation triggers, it dissapears to fade in ?

so sadly it didnt work for our project, i edited the codepen, to pull the animation outside the selector for the slide animation, and added another slide with the same content , the animations dont work at all now, only when the fade is inside the selector for the slide animations but then it shows the same behaviour -.-

sadly i cannot remove the sections cause they all contain different animations , i have just blanked the section before this one out for you guys to better see it , otherwhise you would have to scroll alot to get to the example im gonna try the option of scoping like you said , and see if that helps ps: the sections do pin for a duration in wich animations tied to scrolling appear, and then unpin to slide up the next section, that why there is a blank section ontop, i just removed the content otherwhise it would be to much code to debug the error omg i just tested the approach doin $(self).find('.textfade_Slide1').each( for reusing the animations and it actually seems to work now ( atleast on my codepen ) thank you very much im gonna still have to try it on our project but i have a feeling that was it

well, i have already searched about this issue and found some solutions that worked for others, like givingthe div that is visible before the animation kicks in, a visibility: hidden, and then using autoalpha in the animation, but that for some reason dosent work .. i cant figure out why the text is show before the animation kicks in .. giving it a opacity of 0 in the css also dosent work .. maybe some one here can figure out how to fix this, ps: our project consists of multiple slides like this with different animations and fade ins that are triggered , and every single animation that fades or moves behaves that way -.-