Skip to main content

floaty


Looking for a quick win to add some futuristic animation to your landing page? You’re in luck! We have ascended to new levels of background technology with what we are calling floaty particles. You can achieve this effect in just two easy steps!


Big thanks to @aucaitlin for bringing this functionality up in the Community, without which this wouldn’t have been brought to our attention! 🎉


You can see this floaty in action (built in Unbounce) here:

https://landingpage.noahmatsell.ca/particles/



🚨

This is not an official Unbounce feature. This functionality is based entirely on third party code, and has only been tested in limited applications. Since this isn’t a supported Unbounce feature, our support team will be unable to assist if things go awry. So if you are not comfortable with HTML, Javascript and CSS, please consider consulting an experienced developer.





Click here for instructions

Heres a link to the script: https://gist.github.com/noahub/a81e35c65425a3233239100755ad8ffa


Step 1.


Copy the latest version of the script above and paste it in your Javascripts section with placement ‘Before Body End Tag’


Step 2.


Copy the ID of the target page section and replace the value of the variable section in the code snippet.


Now sit back and let the floaty particles attract all those conversions!




Want to take your Unbounce landing pages + Convertables™️ to the next level?

:spinbounce: Check out the Ultimate List of Unbounce Tips, Scripts & Hacks

YAASSS! I love this effect!


Epic script. Even more epic name! Floaty Particles for the win!

I just lost at least 10mins of my day playing with the interactive floaty particles… awesome!

I love this effect. My only concern would be that it’s a distraction for the user in getting the conversion. It’s just too fun to play with!

For some reason it make my page longer, I am able to scroll down and see white space ( hovewer I have blue bacground everythere)

Screenshot_4

How do we change the COLOR of the particles? I went here to edit:




But none of that converts to unbounce pages.

Hi ! Thanks a lot for your lovely script.

One question : Is it possible to adapt your script to put it on two different box in the same landing (problem with the id) ?

Thanks

N

Would anybody up here be interested in developing something like this for our company?


We are in the phone repair market and having a phone with moving glass as you interact would be a killer value add.


Please feel free to comment or tag someone here who may be able to help.


JJ

Any way to adjust the Speed?

Use particle background - https://bbbootstrap.com/snippets/particles-animation-background-using-particle-js-library-21011683

I think you can use this library if you are using the react framework. It takes only one sentence to achieve great results


It doesnt work anymore.

Reply


Terms & ConditionsCookie settings