How to show a popup on only one device?

I have a popup that I want to be available only on a smartphone, but when I go back to the Desktop layout, “Show on This Device” is grayed out, so I have no choice but to show the popup on the desktop, too.

Is there a way around this?

Is your Popup triggered by a button?

Pop-ups themselves cannot only be displayed on one device, but their content can.
So you have to hide the content of the Pop-Up on Desktop devices.

The problem with the concept of a popup not showing on one device is the “device” is an abstraction that is actually more of a “browser width” in practice, and that can and will change while the page/popup is open. Say an iPad is showing the desktop view and the browser window is docked to half screen? Or a portrait iPhone is rotated to landscape.

Having a popup that is open but is not visible is going to become an interaction problem. There is no provision to auto-close a popup that’s not visible on a different device, when the device (i.e. browser width) changes.

Yes, there’s a button on the smartphone view that opens the popup (which contains a site-search window). Because a site-search window is always visible in the header on the Desktop view, the popup is not needed there.

My inability to hide the popup on the desktop view seems not to be a problem, though. The button that invokes it is hidden on the desktop view, so it never shows up.

Ok, great. That was what I was going to suggest if it was a button opening the Popup.

The point I’m making is exactly that in fact there are cases where it does show up, or rather remains visible when someone transitions from a narrow window to a wide one.

1 Like