概要
- JavaScriptでお手軽にトーストを表示する方法を紹介します
- 独立したライブラリなのでjQuery等への依存はありません。
トーストを表示する
index.html(トーストを表示する)
<!DOCTYPE html>
<html>
<head>
<title>JsFrame.js JavaScript Toast</title>
<meta charset="utf-8">
</head>
<body>
<script src="https://riversun.github.io/jsframe/jsframe.js"></script>
<script>
const jsFrame = new JSFrame();
jsFrame.showToast({
html: 'This is a simple toast', align: 'top', duration: 2000
});
</script>
</body>
</html>
デモ
https://riversun.github.io/jsframe/examples/v150/toast_simple.html
ある程度カスタマイズもできます
https://riversun.github.io/jsframe/examples/jaq/toast.html
まとめ
- ちょっとしたUI開発用途で使いたくて、拙作ライブラリに追加いたしました。
- ライブラリ自体はこちら「フローティング・ウィンドウ ライブラリ JSFrame.js の紹介」で紹介しています。