Creating animated effects using Foundation, Animate and the Target stack...too tricky for all devices?

[Gabrielle (Gabrielle Vickery)]

Hi all, my test site is here: http://stormtempweb.com/stormnew/2/
I’m using Foundation, Animate and target to try to animate a scene, it’s just a rough at the moment so I’m only working on the desktop version at this point.

My problem is that as soon as I resize my large browser window down, all the different element move around on the page rather than sticking to the same proportional areas. I realise that this is probably due to Target. Am I using it correctly or should I be using something else in order to create this sort of animated effect?

Many thanks for your help on this.

[zeebe (Robert Ziebol 🖖🏼)]

First, you need to understand that resizing a desktop browser is NOT responsive design testing.

The BEST testing of Responsive design is to actually use the devices you want to test on. The next would be to enter responsive design mode in Safari:

If you do not see the develop menu option, you need to turn it on in preferences:

Then you can see how the site will look on other devices. Still, the BEST way to test is with an ACTUAL device.

[Gabrielle (Gabrielle Vickery)]

Ok sounds totally sensible, thanks for the information