ノーツのWEBビューの列幅問題への対応として、前回、src要素のtitle属性を使いましたが、もっと、単純にすると、列の値の式は、次になります。

× "[<span title=" + fieldname>" + @Left(fieldname;n) + "</span>]"

  "[<span title=\"" + fieldname + ”\">" + @Left(fieldname;n) + "</span>]" 20090121 訂正

  (spanタグでなく、それらしく abbrタグを使うこともできます)

マウスを対象の上に乗せると、ブラウザのウィンドウをはみ出しても、確実にtitle属性に指定している値を表示してくれるのですが、文字が小さく、数秒で消えてしまうという問題があります。


これについて、Googleで「html ツールチップ」を条件に検索すると、JavaScriptを使った対応など多数ヒットしました。dojoを含め、いくつかのJavaScriptライブラリにも、tooltipsのモジュールがあるようです。


ただ、社内環境で多数のノーツWEBビューで使用するという条件で考えると、簡単に実現・保守できる必要があります。文字を大きくして、マウスを置いている間、表示を持続させるという機能要件は、JavaScriptを使わず、CSSとノーツ列へのHTML追加だけを使っても可能でした。

PHPSPOT開発日誌 に紹介されているCSSをviewTemplateのフォーム・ページに追加し、ビューの列の値を、次のようにします。

"[<a href=\"#\" class=\"tooltip\">" + @Left(fieldName;n) + "<span>" + fieldName + "</span></a>]"


これなら、実現も簡単です。ただ、ツールチップ内での改行がやはり安定しません(テストデータが悪すぎる?)。 ブラウザウィンドウを狭くすると対応できません。また、簡単な動作確認をしただけですが、Firefox3.0.15、ブラウザウィンドウの最下行で、他の列のNewマークがブリンクしているという条件が重なったケースでは、このツールチップのポップアップも一部しか見られませんでした。


確認画面


a Lotus Notes 開発者 ブログ-tooltipsByCSS

比べると、IQJam のツールチップ表示は確かによくできています。このノーツDBのNTFがダウンロードできます。稼働条件がDomino8.5.1とありますが、XPages環境でなくてもこのツールチップ表示が機能するか試してみたいです。