Hey guys,
I have a box element than I can hide with a button, but I want to hide it if I click anywhere outside of it, How can I do this?
Thanks guys!
Depending on where it is on the page you will have to put an onClick event handler function on the page background itself or something behind the box like a larger transparent box that the user can click on and make the box element hide.
Think of it as as a lightbox, where you can close the lightbox with the ‘x’ button or the close button, or you can setup the overlay to be clickable and set to close the lightbox if it is clicked on.
https://support.wix.com/en/article/allowing-site-visitors-to-close-a-lightbox-by-clicking-the-overlay
Otherwise you can simply change the event handler used and maybe use the onMouseIn and onMouseOut functions instead.
I thought about the transparent box, let’s say I do that, now I will hav everything with the hand cursor, how can I avoid the hand cursor for this element?
Thank you very much for your response.
If you use the onClick event function then you will have that and so you would be better off with the onMouseIn and onMouseOut event functions if you don’t want the users mouse icon to change.
See here for more info.
https://support.wix.com/en/article/corvid-reacting-to-user-actions-using-events
https://support.wix.com/en/article/corvid-tutorial-adding-custom-interactivity-with-events
But there’s no click or tab with the mousein option.
Hi Omar, the mouseout function does seem to register taps on my ipad.
Quick update for this post…
To add to Verbal’s reply you can see on this Wix Support page here that you tap your screen on iPads and certain other tablets.
https://support.wix.com/en/article/troubleshooting-ipad-and-tablet-live-site-issues
Keep in mind that iPads and tablets do not have the same capabilities as desktop computers and larger sites may take longer to load. Additionally, some features may not function the same on iPads and tablets (e.g. visitors can tap their screens but cannot hover over elements on your site).