Unexpected problem with popups that are not mobile freindly

I have just realized that the popups (that are not popups) in my main pages are not mobile friendly and I am at a loss how to go about it without upsetting the full page set-up.

take http://pintotours.net/Americas/DomRepublic/StoDomingo.php and press the first “Look inside” button for the Hotel Nicolas in a small device. The pop-up does not fit into the screen.

I thought I had dealt with this because if you open the popup directly from the address bar it works fine, e.g. http://pintotours.net/Americas/DomRepublic/NicolasStoDom.html

This is probably due to fixed width element in

<a class="popup" data-dimensions="600,600" href="NicolasStoDomMap.html">Map</a>
<span class="fromeuro">From $165</span>
<a class="popup look-inside" data-dimensions="700,650" href="NicolasStoDom.html">Look inside</a>

I wonder if the solution is to change the width to percentages in the queries only.

Of course, if possible the answer would be for small devices (through the queries) to call for the full page instead of the pop-up. Is that possible? … which, coming to think of it, is the same as I wondered above…


My problem there is that the data-dimensions come from a js script and there I have no idea how to change it in the media queries…

Could i put something like this in the media queries? But how should it look?

if (document.documentElement.clientWidth < 400) {
	// something to disable the script

The problem has been solved by adjusting the js script

Thank you


This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.