How to disable link to phone number when on Desktop?

Question

How can I add a phone number to a website that is clickable but hides the link when I\'m browsing on a website that doesn\'t support touch.

I could use Modernizr to set

Answer 1

One way of handling this is to create two separate divs and use display:hidden.

Example:

123-456-7890
123-456-7890

In your css set your mobile break points. This part is really up to you. Let's say

@media only screen (min-width: 768px){

.mobile-mobile {
display:none;
}

}

@media only screen (max-width: 767px){

.mobile-desktop{
display:none;
}

}

This should let you hide one div based on screen size. Granted 789 is just a number I picked, so pick a size you believe is mobile. You can find them online at like this site I found on Google or others like it. Lastly, this is just a quick css markup, you might have to tinker but the idea is there.