Replies posted by nlafakis

15 Replies

E
EvanMarshall
posted in Ask a Question

Limit amount of checkboxes that can be selected

I’ve found a JS script that works, however it fails when I embed it into my form code. But that shouldn’t be an issue for your intended purposes. Hope that this works!: $('input[type=checkbox]').change(function(e){ if ($('input[type=checkbox]:checked').length > 1) { $(this).prop('checked', false) alert("Sorry, only 1 selection is allowed."); } }) Stack Overflow - Praveen’s answer

2
N
2 years ago
E
EvanMarshall
posted in Ask a Question

Limit amount of checkboxes that can be selected

Would absolutely LOVE the answer to this question as well! I’ve been searching for it for over 3mo now 😦

2
N
2 years ago
Amanda
Unbouncer
AmandaHead of Community @ Unbounce
posted in News and Announcements

Upgrade your marketing 🚀 The Unbounce Conversion Intelligence Platform is here

3
Amanda
Unbouncer
2 years ago
Charly_Elbaz
Charly_Elbaz
posted in Uncategorized

Make an image appear gradually

The bare code: .element { -webkit-animation: 3s ease 0s normal forwards 1 fadein; animation: 3s ease 0s normal forwards 1 fadein; } @keyframes fadein{ 0% { opacity:0; } 66% { opacity:0; } 100% { opacity:1; } } @-webkit-keyframes fadein{ 0% { opacity:0; } 66% { opacity:0; } 100% { opacity:1; } } /* Additional styles not required */ .pretty { background: yellow; font-family: helvetica, arial, sans-serif; padding: 40px 20px; text-align: center; width: 100%; text-transform: uppercase; font-weight: bold; font-size: 30px; } All you need to do, is name any div within your setup with the class name of: element or you could rename that, doesn’t really matter so long as the class or ID that you want to fade is the same as what’s in the CSS controller.

6
N
2 years ago
Charly_Elbaz
Charly_Elbaz
posted in Uncategorized

Make an image appear gradually

Yes, OMG, I’m SO sorry!!! I forgot that it was a page that I used for prior examples of making things work, lol. I have stripped away all the unnecessary CSS (ignore any/all JS code, it isn’t needed to make this work). I’ve highlighted the part of the css that is most important and controls the fade animation. You can play around with the parameters to customize it to your liking. Let me know if you have any other questions!!

6
N
2 years ago
Charly_Elbaz
Charly_Elbaz
posted in Uncategorized

Make an image appear gradually

You are in quite the amount of luck! I’m sorry that this is reaching you a couple days later, I only now got the email notification of the post. I happened to need the same effect for a page that I was working on, and in fact created a test page that has those elements in it. The entire thing is controlled with CSS only, so no need to load any external scripts, and it’s pretty easy to configure just by looking at it and messing around with the animation timing settings, but let me know if you have any trouble or have additional questions. I haven’t had a chance to do an on-scroll version of it, but looks like @Oliver_Lord already tackled that one!

6
N
2 years ago
N
ninadesign.us
posted in Ask a Question

Horizontal scroll for the images+text

Hey @ninadesign.us!, I know how tricky these things can be because you can’t really just copy/paste into an unbounce html module like you would expect to be able to. Let me know if this example is what you’re talking about, or if you mean you’d like something more complicated like a jQuery based scrolling menu. http://unbouncepages.com/test-horizontalscroll-test-1/

1
N
2 years ago
Blair_Ewalt
Blair_Ewalt
posted in Ask a Question

Multiple pop-ups on click on one page - Only one is working?

OK, so I’m wondering if what you’re talking about is really just a technical/terminology problem more so than functionality. In your description, to me, what it sounds like is that you’re trying to make two(2) “lightbox” buttons, that open two lightboxes which are different from one another. I know “lightbox” isn’t “pop-up,” but they actually perform the same thing, it’s just a terminology difference imho. So here’s a mock-up page that has two buttons linking to two different, “pop-ups,” which have different information in them. http://unbouncepages.com/test-dblpopup-test-1/ This is accomplished really simply by using Lightbox buttons on your page. When you drop one in it’ll automatically create the lightbox which you can then go and edit the contents of. You’ll be able to adjust the height and width on desktop, but only the height on mobile. The rest should be pretty straight forward, but in the event this isn’t what you’re looking for, let me know and I’ll keep looking into it. Best,

7
notmerry
2 years ago
B
BarrettD
posted in Ask a Question

Wipe effect on page elements on scroll (scrollytelling)

No problem at all, happy to help and love trying out new ideas! I’ll let you know if I ever get it to be more advanced or figure out a work-around to it.

7
N
2 years ago
Blair_Ewalt
Blair_Ewalt
posted in Ask a Question

Multiple pop-ups on click on one page - Only one is working?

And a good day to you sir! I’m not entirely sure why you would want two pop-ups to open with one click. Like, I’m trying to visualize the end result of the functionality but can’t quite see it (which is strange for me lol). Do you have an example of what you’re talking about? I mean I get what you want to do mechanically, but visually are you trying to show two different messages at once in a single pop-up? Or do you mean you hit the button and one pops up then when that’s closed another is behind it? Sorry, for once, I actually need more info 😅

7
notmerry
2 years ago
B
BarrettD
posted in Ask a Question

Wipe effect on page elements on scroll (scrollytelling)

So that’s where the fun ends unfortunately. UnBounce doesn’t support parallax for mobile. Maybe that’s something they’ll do in the future, but I’ve only been using it for a couple months now and I haven’t had the time to deep-dive the page code and see if there’s a way of making it work for mobile. If I ever do, I’ll definitely post the results here! For now, it’s just desktop 😦 Trust me, there’s a TON of stuff I’m trying to make work, sticky navigation bars, more complex parallax actions, triggered events, etc… Just takes time because it’s not exactly a free-for-all with the code, there’s a lot that has to be pre-loaded which weighs down the pages more, and things have to just be built differently because there’s no access to the unBounce container code outside of inspecting it.

7
N
2 years ago
B
BarrettD
posted in Ask a Question

Wipe effect on page elements on scroll (scrollytelling)

Ok, so this is SUPER crude, but it gives you a good idea for how this would work. So the first section has that first slide (there’s 5) as the background. the next section has parallax applied to it and uses slide 2, so on through slide 5. You’ll want to make sure that your slides are all the same width and height exactly or they won’t line up one on top of the other. This example is 3300w x 1080h, so it’s made to look best on 1920x1080 resolutions. But of course you can scale it down. The only thing you’ll never be able to account for is the height of the person viewing the graphics, but I feel that having it be at 1080 will be fairly safe for any monitor since the amount of information being viewed is well within a 768h area. If none of that makes sense, I apologize lol! The only real big problem with this is that obviously it’s not going to scroll and hold on the image, it just keeps scrolling to the next slide. In my honest opinion, given the limitations, this works as good as it’s

7
N
2 years ago
B
BarrettD
posted in Ask a Question

Wipe effect on page elements on scroll (scrollytelling)

I love this idea!!!, and though I cannot say with 100% certainty that it can be done, I can think of several ways of doing it. Unfortunately I don’t have the time to test them at the moment, but I’ll fiddle with it this week and see what comes of it. By default, this feature doesn’t exist, but I can say that playing around with the parallax feature for the different sections, is definitely a good place to start. In terms of the link you posted…whew! That’s a LOT of scripting. I looked at the source code and it’s massive. There’s a lot going on to make those animated sequences happen. What I’m thinking of is a somewhat “cheaper,” version of that, but I think it’d be a method that most unBounce users can handle without all the complex scripting.

7
N
2 years ago
T
Tanguy
asked in Ask a Question

Creating a floating animation with CSS - mouseover

Perfectly illustrated solution and an awesome effect too!

3
N
3 years ago
sanchore
sanchore
posted in Ask a Question

CSS for Embedded Hubspot Form - Help & How?

@sanchore - Was wondering if this was a fix for you because I’m trying to do the exact same thing, style a HubSpot form within the unBounce landing page. I really do wish there would be documentation about different integration tools and how to add+manipulate them within unBounce. Both software sets seem to be very limited in terms of allowing customization beyond the tools provided. Update: Using the code above worked, however there’s an issue with anyone also using reCaptcha and I believe that problem is only solved on HubSpot’s end. I’m talking to them now about the solution to that problem but at least for now the forms are able to be styled beyond what’s available. Thank you @Kyle.C!!!

6
N
3 years ago

Badge winners

Show all badges
Terms & ConditionsCookie settings