Removing image based on type of device with js and class

Question

I have a website where I want the app store button to be present only on apple devices. Same with google play button on android devices. I think the simplest way would be to use some js to hide an image based on device used.

I'm a noob at js, but could you do something with code like:

if device == "iPhone3,1" { imageview.hidden = true }

If so, where do I add this and how do I link it to a specific image if the images class is 'app-btn' ?

This question: http://stackoverflow.com/questions/3514784/what-is-the-best-way-to-detect-a-mobile-device-in-jquery has some good answers — OliverRadini, Nov 06 '15 at 15:57

score 0 · Answer 1 · answered Nov 06 '15 at 16:01

try something like this:

if(/iPhone|iPad|iPod/i.test(navigator.userAgent))
    document.body.classList.add("ios");
else if(/Android/i.test(navigator.userAgent))
    document.body.classList.add("android");

now the <body> tag has an android or ios class, use css to display or not the images.

Removing image based on type of device with js and class

1 Answers1