Last active
December 20, 2015 13:08
-
-
Save JGallardo/6136023 to your computer and use it in GitHub Desktop.
Example call-to-button. The purpose of this element is to be a call to action to actually call in, On mobile, the ability to just push it and call will be available. Otherwise on desktop, it is just a big visual cue. Now to add the Javascript to disable as a link when not on a mobile device.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div id="headerCTA"> | |
| <div> | |
| <a href="tel:888-336-1301"> | |
| <div> | |
| Schedule a pickup<br> | |
| 888-336-1301 | |
| </div> | |
| </a> | |
| </div> | |
| </div> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
What I would like to build is a button that will allow the user to call in. On desktop this element will look like a big call-to-action, then on mobile this will be both a call-to-action and an actual method to call.
The challenge that I need to address now is that the ability to call should be only present when on mobile. But when on desktop (dictated by screen width?) this link should be deactivated. At the moment if someone happens to click on this from desktop, it attempts to open a page as "tel:888-336-1301"
Which produces the following error:
The address wasn't understood
Firefox doesn't know how to open this address, because the protocol (tel) isn't associated with any program.