Custom Code and Lightboxes on Mobile


Hi there!

I’ve been beating my head against the wall trying to figure out why my lightbox videos work as an overlay on desktop mode but as a sub-page on mobile. I’m wanting to get the lightboxes as an overlay in mobile as well. I’m starting to wonder if there’s some unknown quark that I am not aware of in Unbounce that prevents overlays in certain circumstances in mobile. Here’s what’s going on:

I have custom HTML code with 4 different buttons built. I then created a lightbox button from Unbounces UI in order to get the URL link that activates the lightbox, as well as the unique ID and class (I found that the ID that is generated also acts as an event listener that activates the lightbox javascript - but I’m not sure why). Anyway, I hard coded the link into my custom code as well as the ID, manipulates the style automatically generated with lightbox button, and everything works great - in desktop. Did the same thing in mobile and it creates a sub-page. PLEASE SHOW ME THE ERROR IN MY WAYS!


Hey Ryan,

Is the custom code and lightbox situation revolved around something called swipebox? There is an error in the javascript and I’m wondering if that is the cause.


Hey Kyle, its so weird because that code was deleted from this and all landing page iterations and yet it remains. I was able to reslove it. I was using 2 different custom codes and for some reason the IDs wouldn’t work on the second in mobile. So I combined it all into one and controlled the mobile layout using css. Lesson learned.


Okay great, glad you got it sorted out :slight_smile: