Let me give you some context…
When a user is in my online store and they see a product they want, they choose “Add to Cart” and for v2.0 of my site, I want a light box to pop up and show them that the product was added to their shopping cart. And because it is a light box, they can figure out that by closing the pop up they will be right back to where they were. (Much better, I suppose, than taking them to their shopping cart directly.)
But how should that work on mobile?
I agree that the screen is too small on a smartphone for people to be able discern the light box from the background page. So what options would I have if I cannot use a light box?
Am I forced to redirect them to their shopping cart?
Or is there another way to provide a better experience without using a light box?
I think your response was just telling me how to write things so that my code knows when to display a light box. But what I really need help understanding is what do you do if using a light box isn’t acceptable on a mobile device.
Oops, I didn’t notice this was in the Design/UX section
I’m no expert on the shopping cart scenario, so I just went out to the most common shopping cart situation I run into, which is Amazon. You’ve probably already looked at what they do, which is to drop you into the cart, and give you a “Continue Shopping” button (which is the same as the back arrow). That page is presented full-screen, so it doesn’t come across visually as a pop-up or lightbox to the user.
I suppose you could also make it look a bit more popup-ish" by making that shopping cart page slide in from the right side of the page, and have a “<” button top left to represent the “continue shopping” button.
If I were making a store, I’d probably do that interaction as closely as possible to the way other stores do it, just for the sake of user familiarity.