Skip to main content
A
Anonymous
November 14, 2017
Question

Website Pop-Ups

  • November 14, 2017
  • 1 reply
  • 6116 views

What is the best way to implement a Modal Lightbox/pop-up that contains a Marketo form, and include it on the Home page of our site so that it opens when a visitor first hits the site? It has to work across all browsers, and scale to work on mobile devices (so that it can be easily dismissed if the user doesn't wish to fill out the form.) I have been testing out an embedded Lightbox code generated by the Marketo form designer, and I finally got it to display correctly on Internet Explorer, but the pop-up takes up the whole window on a mobile device such as a smartphone, and the "X" to close the pop-up is so close to the edge of the screen that you can't click on it to close out of the pop-up window. Does anyone have any suggestions on how to best implement a cross-browser pop-up that dynamically scales in size? Is JavaScript the best way to go (and if so does anyone have any code example), or has anyone made it work using the Marketo generated embed code for a Lightbox? Please help!

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

1 reply

M
Mark_Price
Level 6
November 14, 2017

Hi Matt,

Do you have a testing page to link?

If your site uses foundation, bootstrap or any other frontend framework, there is probably an existing function for a modal.

For the Marketo out of the box option- I'll have to defer to the community as I usually do the above. 

hope it helps!

A
Anonymous
November 14, 2017

This is a simple page where I’ve been testing the pop-up: riskinnovations.com/website-feature-test-page/ We use a managed WordPress site for our company Website.

I basically need it to do what it’s doing now (on Chrome and Internet Explorer) in Firefox as well (it moves down and to the right on Firefox.) I would also like it to scale, if possible, so we can use it on mobile devices. Right now it takes up the entire screen, and you can’t close it because the “X” is right at the edge of the screen. The pop-up was created by embedding the Lightbox code that was generated by the Marketo form designer, in a Code Block element in WordPress. I finally got it to display more or less how I wanted it to in Internet Explorer using the z-Index attribute (it was originally opening underneath our sticky header), but it works differently in Firefox. I need it to work the same in all browsers, as much as possible, whether it's on a desktop, laptop, or mobile device.

Thanks for taking the time to look at it!

SanfordWhiteman
SanfordWhiteman
Level 10
November 14, 2017

Firefox bug is fixed in one of my posts here (or maybe 2) -- search the Community as I think I linked to it w/in the past 30 days.

Terms & ConditionsAccessibility statement

Loading footer...