Browser detection to hyperlink to corresponding URL

I have a massive Hype document with several hyperlinks to specific URLs.

My client wants to be able to access one URL when viewing content on an iPad, and a different URL when viewing content on a desktop using Firefox or Chrome.

I can create two separate Hype documents, but I’m guessing that there’s a way to Javascript to detect the browser and based on that information, open the appropriate URL — all within the same Hype document.

Can someone help?

Thanks in advance.

Joe

The way I would do this is use a regular navigator detection, and then show a timeline which swaps out a different element based on what is detected (you can have the animation be instant, but in this demo I animate it in):

checker.hype.zip (12.0 KB)

 var ua = navigator.userAgent;
    // console.log(ua)
    var checker = {
      iphone: ua.match(/(iPhone|iPod)/),
      firefox: ua.match(/(Firefox)/),
      android: ua.match(/Android/),
      chrome: ua.match(/Chrome/)
    };
    if (checker.android){
        //
    }
    if (checker.chrome){
    hypeDocument.startTimelineNamed('chrome', hypeDocument.kDirectionForward);
    }
    if (checker.firefox){

     hypeDocument.startTimelineNamed('firefox', hypeDocument.kDirectionForward)
    }
    else if (checker.iphone){
        //
    }
    else {
        // none of the browsers listed were detected, so do something for all else here
    }

To make more detection scripts, you’ll need to see what the browser’s name is, or some other unique identifier. (Don’t use the browser version since that changes).
Here’s a nice way to see that onscreen which you can load from your device: https://jsfiddle.net/kmturley/Gd6c8/

What are the different URLs that you’re sending folks to? If there’s some query string you’re adding to the end of a URL this could be a lot simpler. (For example, sending iPads to:https://example.com/site.html?ipad )

Thanks Daniel!

There are hyperlinks in the document that currently point to URLs within a sales enablement platform. I can’t change those URLs.

When outside of the sales enablement platform, the user would access public-facing URLs, also outside of my ability to change.

Will dig in deeper to what you’ve shared. Than you so much!

Joe

1 Like