Instant Popup Show

Hi all,

I am trying to achieve an ‘Asana’ or Autopilot style instant popup, where the popup appears instantly on button click.

However, the Bubble show action has a fade in effect that takes 1-2 seconds, and i’ve also tried an animation with a 1ms transition but neither work great.

Any plugins or workaround for this?

Reece

@help I think Gaurav’s plugin might do the trick. But I’d have him give his input.

@gaurav

Thanks, tried it but it doesn’t do that (despite the name) it’s more for creating different styles of popup, but each one appears to be a standard animation.

I’d ideally like something that I can plug the popup ID in and trigger it that way for example

Try this CSS

.bubble-element.Popup {
opacity: 1 !important;
}

.greyout {
opacity: 1 !important;
}

There’s a delay when closing it, but it does open instantly. To get rid of the closing delay, you can do something a bit hacky.

Make a workflow for when popup isn’t visible and set to run every time. Add an action in that workflow to set a state to “yes” Add a conditional on the popup to set background opacity to 0 and greyout color to 0 when that state is “yes”.

Don’t forget every time that popup is opened, you will have to have a workflow to set that state back to no.

2 Likes

Just realized I forgot to push that update live.
Pushed an update with added support for disabling the animation. You’ll see a ‘disable animation’ of yes / no type in the popup step.

1 Like

Thanks a lot for the effort there Tim! Will give it a go :slight_smile:

Dude, you’re a genius! Thank you :slight_smile:

Hey Tim,

It doesn’t seem to work with Modals in a Reusable Element, but works perfectly for normal popups on page.

Any idea why?

Figures it out, just changed the class selector to .bubble-element, .CustomElement

1 Like