スマホ用の電話表示

レスポンシブサイトでPCの時にはテキスト表示、スマホ時にはタッチでCALL出来るようにするコード。

headに追加
電話番号に自動でリンクされるaタグを無効化

<meta name="format-detection" content="telephone=no">

電話をこのタグで表示

<span data-action="call" data-tel="03-1234-5678">03-1234-5678</span>

javascriptを追加

$(function() {
	if (!isPhone())
		return;

	$('span[data-action=call]').each(function() {
		var $ele = $(this);
		$ele.wrap('<a href="tel:' + $ele.data('tel') + '"></a>');
	});
});

function isPhone() {
	return (navigator.userAgent.indexOf('iPhone') > 0 || navigator.userAgent.indexOf('Android') > 0);
}