タッチパネルデバイスだとマウスカーソルがないからtitle属性のチップヘルプ（ツールチップ）が表示されない。
というわけで、JavaScriptでやってみた。
コード
<script>
if(document.addEventListener) document.addEventListener("DOMContentLoaded",tipSet);
function tipSet(){
var obj=document.getElementsByTagName('li');
for(var i=0;i<obj.length;i++){
if(!obj[i].title) continue;
obj[i].addEventListener('touchend',tipOpen);
}
}
function tipOpen(e){
window.getSelection().removeAllRanges();
e.preventDefault();
var obj=document.createElement('div');
obj.id='tip';
obj.style.position='absolute';
obj.style.backgroundColor='black';
obj.style.color='white';
obj.style.top=e.target.offsetTop+e.target.clientHeight+1+'px';
obj.style.left=e.target.offsetLeft+'px';
obj.style.lineHeight='1em';
obj.style.padding='0.5em';
obj.style.marginRight='0.5em';
obj.appendChild(document.createTextNode(e.target.title));
window.addEventListener('touchstart',tipClose);
e.target.parentNode.appendChild(obj);
}
function tipClose(){
var obj=document.getElementById('tip');
obj.parentNode.removeChild(obj);
window.removeEventListener('touchstart',tipClose);
}
</script>
<ul>
<li title="ヘルプ１">項目１</li>
<li title="ヘルプ２">項目２</li>
<li title="ヘルプ３">項目３</li>
</ul>
サンプル
title属性つきなのでマウスカーソルがあれば普通にチップヘルプ出ます。
スマホ等のタッチパネルデバイスの場合は touchend で真下に表示して、どこかタッチで消えます。
画面右端に溢れる場合に座標調整必要かとも思ったが、表示内容が日本語なら自動改行してくれるし、右にmarginつける程度で良さそう。
marginとpaddingはフォントサイズ依存でem単位にした。
画面下端にはみ出す場合は上に表示したほうが良いと思うが、めんどくさいし、
今回の目的のページでは画面下にfixedの要素が表示される場合があるので難しいので何もしてない。
タッチイベントの時に同時にテキスト選択が発生する可能性があるが、
チップヘルプ表示時にセレクションを削除して、ブラウザ標準動作をキャンセルした。
だが、テキスト選択を解除しても選択文字列のWEB検索みたいな領域が閉じない場合があるみたい。どうにもならんと思う。