Boost」など、さまざまなカンファレンスを企画・運営しています。BOOKS(コードジン・ブックス)は、CodeZineの連載からカットアップした、開発現場の課題解決に役立つ書籍シリーズです。3AndroidのToastを再現する「CFToaster」まとめ参考資料AndroidのToastを再現する「CFToaster」CFToasterは、https://github.com/pyuan/cftoasterにおいてMITライセンスで配布されています。ダウンロードしたファイルのうち、jquery.cftoaster.1.0.1.min.jsおよびjquery.cftoaster.1.0.1.cssをHTMLから参照させます。Notific8よりさらにシンプルで、AndroidにおけるToast表示のようにテキストを画面中央に表示するだけのプラグインです。CFToasterで通知を表示させるには、通知を表示させるjQuery要素に対してcftoasterメソッドをコールします。シンプルな通知表示の処理はリスト6で実現できます。"シンプルな通知"});リスト6を実行して表示される通知を図6に示します。リスト6を実行して表示される通知cftoasterメソッドの引数にJavaScriptオブジェクトで通知のパラメータを指定することができます。主なパラメータを表3に示します。75例えば、表示時間を1秒にし、背景色を青、文字色を黒にするためにはリスト7のように記述します。fontColor:"#000000"});リスト7を実行して表示される通知を図7に示します。APIと呼ばれるHTML5のAPIを利用すると、ブラウザの外部に通知を表示することができます。APIを使用した例はダウンロードできるサンプルコードに含まれています。APIは将来的にHTML5の一部として広く利用されることが想定されますが、現状ではサポートされるブラウザが限られ(Chrome、Firefox、Safari。Explorerは未サポート)、サポートされていてもブラウザごとの方言がまだ存在する状態で、使い勝手が良い状態とは言えません。APIは(少なくとも現状では)ブラウザ画面の外部に通知が表示されるため、ブラウザ画面内にWebコンテンツの一部として表示される通知とは性質が異なります。APIが実用的になったとしても、今回紹介したjQueryプラグインによる通知の表示はその価値を失わないものと考えられます。まとめ本記事では、Webページの画面内に通知を表示するプラグインを3種(noty、Notific8、CFToaster)紹介しました。JavaScript標準のalert()やconfirm()によるメッセージ表示の代わりに利用すれば、利用者から見てよりスマートな使い勝手を提供できるのではないでしょうか。NECにてシステム企画業務に携わるが、2003年4月に念願かなってフリーライターに転身。Technologies。執筆コミュニティ「WINGSプロジェクト」代表。