Jacopo Di Capua
Jacopo Di Capua

Reputation: 1

Onclick function doesn't working on mobile

I'm a novice of JS and I'm trying to get this result (https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_popup) but I've got some problem with the mobile view of this code...it works good on every other devices but not on iPhone (x, 8, etc). How is it possible?

function myFunction() {
    var popup = document.getElementById("myPopup");
    popup.classList.toggle("show");
}

Upvotes: 0

Views: 1411

Answers (1)

Igor Bykov
Igor Bykov

Reputation: 2812

If the problem happens exactly on Safari, it might be due to the missing cursor: pointer; in your CSS.

Safari doesn't like to fire your functions on HTML elements that don't follow certain conditions.

By the way, even if they do (according to my personal experience) it's not guaranteed that your listeners will actually fire.

It happens due to the fact that browsers like Safari or IE seems to be more about a good joke than a good browser.

How do we deal with that?

Well, IRL we mostly use some libraries (for instance, Vue or React) that perform cross-browser optimization better than we do.

For your simple use case, you might want to convert your "myPopup" element into a zero-styled button.

All major browsers tend to work more or less ok with buttons.

Upvotes: 2

Related Questions