Hello!
im using wix studio editor and want to achieve the following
a 360 spin on a product triggered by the scroll animation, scroll down: product turns right, scroll up: product turns left.
i tried different approaches, render a 3d model in the editor using JSON, .glb or .gltf. i alo tried couple of third party apps, which enabled the user to interact with the model using mouse gesture, like scroll to zoom and drag to turn. but don’t allow scroll triggered animation.
i was able to work around it with adding multiple product images/frames and animated each image to fade on scroll, so that the models appear to be turning.
it kind of worked but it isn’t the optimal approach. resulting with overlapping images due to a fluid opacity change. on each image i added a fade animation with a pan of 1% to minimise the effect. ex: img 1: fade in from 50% to 51%, Image2 from 52% to 53%… and so on. i used 37 images for that. which i didnt find enough. and adding more will affect the site’s loading time.
i considered adding a video and linking video play time with scroll position. but didn’t find a way to make that work.
i appreciate any input on the subject!