Linking to correct playstore not 100% working

Hi,

I have a banner that pops up after 8 sec. This is normal. When clicking on the banner, it should send you to the apple or google play store, dependent on which device you use.

No matter what I do, it’s never 100% working. Or it’s sending you on both devices to the apple play store or on both devices to the google play store. Or it is only showing the android banner etc.

Custom code I use:

#ios-link, #android-link { display: none; }
> <script>
>   document.addEventListener("DOMContentLoaded", function() {
>     var iosLink = document.getElementById("ios-link");
>     var androidLink = document.getElementById("android-link");
> 
>     // Functie om het mobiele besturingssysteem te detecteren
>     function getMobileOperatingSystem() {
>       var userAgent = navigator.userAgent || navigator.vendor || window.opera;
> 
>       // iOS detecteren
>       if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
>         return "iOS";
>       }
> 
>       // Android detecteren
>       if (/android/i.test(userAgent)) {
>         return "Android";
>       }
> 
>       return "unknown";
>     }
> 
>     // Besturingssysteem van de gebruiker detecteren
>     var os = getMobileOperatingSystem();
> 
>     // Op basis van het besturingssysteem de juiste link tonen en instellen
>     if (os === "iOS") {
>       iosLink.style.display = "block";
>       iosLink.addEventListener('click', function(event) {
>         event.preventDefault();
>         window.location.href = "https://apps.apple.com/nl/app/stan/id1555019453"; // Vervang door jouw iOS App Store link
>       });
>     } else if (os === "Android") {
>       androidLink.style.display = "block";
>       androidLink.addEventListener('click', function(event) {
>         event.preventDefault();
>         window.location.href = "https://play.google.com/store/apps/details?id=nl.trafficandmore.stan&hl=en_US&gl=US"; // Vervang door jouw Android Play Store link
>       });
>     }
>   });
> </script>

Blockquote

Can someone take a look and help me out of this pickle!

https://preview.webflow.com/preview/stan-a9dd55?utm_medium=preview_link&utm_source=designer&utm_content=stan-a9dd55&preview=2992ed5767a30c12622413b679374a25&pageId=6674209dce60f2fdcd50b254&workflow=preview

Hey!!

For anyone else running into this issue, ive made this script here which provides an easy way to hide or show elements based on OS, device, or browser :)