Tel link fallback

Question

I am currently working on a mobile version of a site which has a "Call" link at the top. I'm using a tel: protocol link to deal with that right now, but the problem is what happens if the user is on a tablet or a phone with no SIM card etc. If possible, I'd like to try the tel: link and if that fails then pop up a DIV with a couple of phone numbers they can choose from. Any ideas how it might be possible to detect if the tel: link worked/works, either at page load or when it is clicked?

Answer 1

You're probably better off changing the way you present the phone number to the user. How about putting the information next to the call button or with a drop down that shows it? Detecting whether or not it succeeded is not likely to be cross platform.

Another suggestion would be to change "call" to the phone number itself. Tablet users are less likely to click on it anyway if they actually see the number. "Call" is likely to either piss them off by thinking the phone number is being concealed from them assuming they're on a smart phone or make them think "ah, I can click here and it'll show me the number."

Answer 2

This is the closest thing available to what you may want to fool with: https://developer.mozilla.org/en-US/docs/Web/API/window.navigator.connection

Modernizer has an option to check this value for low/high bandwidth connections (look in the non-core options). Here is the GitHub for the extension.

The browser support isn't very good yet, but it's something to watch for the future, for sure.

It's also not bulletproof for your needs, as even an iPod touch or a phone without a dataplan can call out via VoIP over wifi, but wouldn't register as having a "connection" (I assume). This may not be possible for while, I'm not sure how you'd know for sure that any given device could or couldn't dial out.