How to close modal popup

m4trix.dev
36 Posts
m4trix.dev posted this 14 December 2022
Ask a Question

Hello, sometime the X icon used to dismiss the popup is not visible on screen. Is there a way to see the page in a way that the popup is dismissed if used click outside the popup? this is a typical behaviour that is consistently applied in mobile app design

thanks

Hello, sometime the X icon used to dismiss the popup is not visible on screen. Is there a way to see the page in a way that the popup is dismissed if used click outside the popup? this is a typical behaviour that is consistently applied in mobile app design thanks
Vote to pay developers attention to this features or issue.
7 Replies
Order By: Standard | Newest
Support Team
Support Team posted this 14 December 2022

Hi Matteo,

We'll consider your suggestion. Please provide the examples where you do not see the X button.

...................................................
Sincerely,
Hella
Nicepage Support Team

Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1
Follow us on Facebook: http://facebook.com/nicepageapp

Hi Matteo, We'll consider your suggestion. Please provide the examples where you do not see the X button. ................................................... Sincerely, Hella Nicepage Support Team Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1 Follow us on Facebook: http://facebook.com/nicepageapp
m4trix.dev
36 Posts
m4trix.dev posted this 14 December 2022

I have solved the problem by adding some extra css to add scrolling functionality to the modal popup, so this is just a suggestion for you to consider

I have solved the problem by adding some extra css to add scrolling functionality to the modal popup, so this is just a suggestion for you to consider
GRAFKOM
38 Posts
GRAFKOM posted this 14 December 2022

m4trix.dev - can you send this css code?

m4trix.dev - can you send this css code?
m4trix.dev
36 Posts
m4trix.dev posted this 14 December 2022

.xxx {
min-height: unset !important;
max-height: calc(100vh - 100px) !important;
overflow-y: auto !important;
}

.xxx { min-height: unset !important; max-height: calc(100vh - 100px) !important; overflow-y: auto !important; }
GRAFKOM
38 Posts
GRAFKOM posted this 14 December 2022

m4trix.dev - Thank you very much.

m4trix.dev - Thank you very much.

Last edited 14 December 2022 by GRAFKOM

Support Team
Support Team posted this 16 December 2022

Hi Matteo,

Thanks for the suggestion, we'll consider it for the wishlist.

...................................................
Sincerely,
Hella
Nicepage Support Team

Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1
Follow us on Facebook: http://facebook.com/nicepageapp

Hi Matteo, Thanks for the suggestion, we'll consider it for the wishlist. ................................................... Sincerely, Hella Nicepage Support Team Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1 Follow us on Facebook: http://facebook.com/nicepageapp
kcraven
7 Posts
kcraven posted this 03 May 2023

In my experience so far there are major issues with the modal popups. For most device views these must be either quite small or they must be stuck to the top of the page (over any header). This is most common on Mobile views. Certain mobile phones also seem to default to Tablet layout when viewing some pages (but horizontal mobile for others on the same device?) which often leads to the X being outside the view.

Click outside to close is quite standard functionality for most unobtrusive popups/pop overs at this point, especially for mobile.

The combination of the positioning issues, lack of click outside to close & ways that mobile caching tends to work also often create a circular trap on page reload where the pages reload with the modal open & users who cannot see the X cannot access the page or navigate the site.

Functionality seems to have even been included in Nicepage's own instructions for creating custom modal popups before fully supported https://nicepage.com/doc/55883/custom-modal-popups

Logically that means that these options should have been included when they were added. Not sure how one would go about injecting the necessary components into the existing code generated by a current version of Nicepage without needing to manually edit the code after each export.

In my experience so far there are major issues with the modal popups. For most device views these must be either quite small or they must be stuck to the top of the page (over any header). This is most common on Mobile views. Certain mobile phones also seem to default to Tablet layout when viewing some pages (but horizontal mobile for others on the same device?) which often leads to the X being outside the view. Click outside to close is quite standard functionality for most unobtrusive popups/pop overs at this point, especially for mobile. The combination of the positioning issues, lack of click outside to close & ways that mobile caching tends to work also often create a circular trap on page reload where the pages reload with the modal open & users who cannot see the X cannot access the page or navigate the site. Functionality seems to have even been included in Nicepage's own instructions for creating custom modal popups before fully supported **https://nicepage.com/doc/55883/custom-modal-popups** Logically that means that these options should have been included when they were added. Not sure how one would go about injecting the necessary components into the existing code generated by a current version of Nicepage without needing to manually edit the code after each export.

Last edited 03 May 2023 by kcraven

You must log in or register to leave comments