I’m not 100% sure this is a bug, but it seems like it might be. However, it is also likely that the configuration of my styles is conflicting.
I have a section, 100% width & height. In that section I have a Div with relative position. Inside the Div I have an image centered using position:absolute, left:50%, top:50% and transform -50% top and left to force it to the center of the screen.
I want the image to fade in / out as the page scrolls. I added an interaction with a scroll trigger, but when I click the “+” to add the initial appearance, the image jumps position down and right. It becomes only 1/2 visible in the window. Please see the attached screen shots. Could you please help me figure out what I’m doing wrong?
sorry for the delayed response, I can’t see your issue directly but the reason for it is that when you add an initial aperance it will reset the transform, so inside the initial apperance you have to move it up and to the left again.
I see what you mean. However, there are no options in the transformations to move the image Left -50%, Top -50% so it is centered in the window. I suppose it is not possible to have a centered image with transformations?
Although the image appears to move when setting transformations, when I test the preview of the site, the image does not move at all. This is quite confusing, but at least now I know the problem is not with my set up
