Using TEL and EMAILTO at the same time

Question

So im dealing with a minor issue on a website im coding, i made it so any image is clickable and will activate a phone number to call to as im dealing with bookings (restaurants, spa, services, when clicked it triggers the phone app on any mobile device and Skype on PC.

As not everyone has a Skype account (with credit), how could i implement the emailto tag when the website is used on a desktop on the same images that already have the tel tag?

Answer 1

Here's a quick solution using jQuery and isMobile, along with a data attribute to hold the phone number.

$(document).ready(function() {

  // Determine if we're using a mobile device
  if (isMobile.any) {

    // Loop through each link with the data-tel attribute
    $('[data-tel]').each(function() {

      $(this)
        // Update the link's href to use the telephone number
        .prop('href', 'tel:' + $(this).data('tel'))
        .text('Tel link (mobile detected)');
    });

  }

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ismobilejs/0.4.1/isMobile.js"></script>

<a href="mailto:test@aol.com" data-tel="555-1234-567">
  Email link (desktop detected)
</a>