jQuery to Disable IE MS Lync phone number icons
Corporate environments have been pushing out MS Lync as the IM successor to Office Communicator. With that comes a click-to-call plugin that automatically puts a little phone icon next to any detected phone number on a web page. I can only assume that clicking the icon will make a phone call, as if anyone really wants that feature to be on by default.
Unfortunately for web developers, the icon is rendered by inserting markup into the webpage. This is a problem for a number of reasons:
- The icon looks like it is part of your page, but it’s really not.
- It even prints with the page.
- It screws up your layout because the icon is inserted AFTER the page is rendered and onLoad javascript executes! This plays double issues when using a scrolling tables plugin like jQuery datatables because now the header doesn’t lineup with the columns.
- There is no meta tag to disable the plugin. The only option to disable the plugin is up to the user or administrator, and we know we can’t count on users to disable it for us.
Our phone numbers were in the common US format of (555) 555-5555. After some trial-and-error I found that MS Lync does not detect phone numbers that use a non-breaking hyphen (‑) instead of the normal hyphens (- and ၰ) (big thanks to this Dashes and Hyphens page).
Now I could have changed our code server-side to render the new hyphen, but this caused issues with our exports to Excel, Word, and PDF. So instead I created a simple jQuery plugin that will replace the common - hyphen with a ‑ non-breaking hyphen and foil the MS Lync plugin from detecting our phone numbers.