Different Javascript behavior between iPad & IPhone

Asked Mar 03 '17 at 08:24

Active Mar 03 '17 at 08:24

Viewed 89 times

I'm trying to figure out a difference between iPad and iPhone behavior using Javascript.

Using this code to switch between elements by changing class and switching between opacity (previously display:none), it works fine in Android, Desktop and iPad, but iPhone refuses.

I have 6 divs like this here as example:

<div id="blue6" onclick="show('id6');" class="switchDivContainer" style="border-bottom:0px;">

And code like this to control it

function show(elementId) { 
 document.getElementById("id6").className = "hideClass";
 document.getElementById(elementId).className = "MyClass";
}
</script>

Live page can actually be seen here The blue area should make the images/videos switch, but iPhone says no-no.

The question is really - why does this work like a charm in everything but iPhone.

asked Mar 03 '17 at 08:24

Effect Erik

1

I have the same issue on iPad, so instead of using `Click` event i need to use `Touch` event. Try with that. – Stefan Mar 03 '17 at 08:37
That sounds promising. Something like ontouch=""? – Effect Erik Mar 03 '17 at 08:54
I'm not sure that inline touch event exist, but I do it like this [link](http://stackoverflow.com/a/11398089/3888517) – Stefan Mar 03 '17 at 08:58
have you tried adding an eventListener() to listen for the click – Toxide82 Mar 03 '17 at 09:37
There may be a problem with opacity property on IOS. Try to use opacity together with visibility property, worth a shot. – Cata John Mar 03 '17 at 20:26

Different Javascript behavior between iPad & IPhone

0 Answers0