【JavaScript】国産ライブラリtmlib.jsを使ったアニメーション入門

introductory-javescript-tmlib

「tmlib.js」はゲームやブラウザツールを簡単に作る事ができる国産のJavaScriptライブラリです。「tmlib.js」を使うとアニメーションや画像表示、サウンドなどゲームなどに必要な処理がプログラミングしやすいようになります。

WEBサイトなどにもアニメーションやクリックしてアクションを起こすなど新しい要素をして取り入れてみても面白そうです。国産のライブラリなのでサンプルなども日本語で多く公開されています。

ダウンロード

「tmlib.js」のライブラリはこちらからダウンロード(GitHub)することできます。

基本的な使い方

使い方はシンプルに「tmlib.js」をscriptタグで読みこみ処理するコードを書くだけです。

<script src="tmlib.js"></script>
<script>
// TODO: ここにコードを書いていく
tm.main(function() {
alert("tmlib.js バッチリ読み込まれてるよ!!");
});
</script>

チュートリアルやサンプルなど公式サイトより紹介されておりますので参考になります。

ひよこアニメーション – tmlib.js – 0.1.7

ひよこをクリックすると絵柄が変わりアニメーションに切り替わります。

関連記事

Windows 10からWindows 11へのアップデート時に気をつけるべきポイント

Windows 10のサポート終了が近づいており、これをきっかけに多くの方がWindows 11へのアップデートを検討しているかと思います。Windows 10は2025年10月14日でサポートが終了し、その後はセキュリティ更新やサポートが提供されなくなります。そのため、今のうち...続きを読む

2025.07.25Windows10

【WP】ワードプレスのカスタムメニューのカスタマイズ

先日ご紹介をしたWordPressのカスタムメニューの機能。出力されるタグをみるとクラス名が多く記述されているのがわかります。記述されているクラス名を使いCSSでメニューのデザイン、表示など変更する事も可能ですが、クラス名が多すぎて煩雑になりやすいので、今回はよりカスタマイズ...続きを読む

2015.08.19WordPress

モバイル端末の画面サイズまとめ

WEBサイトを制作するときのサイズの基準になるのが画面の解像度です。 基本的には、ディスプレイサイズに合わせてデザインされるので、横幅が920px~1024pxあたりでレイアウトされるのが主流といえます。 最近では、スマートフォンやタブレットなどでWEBサイトを閲覧する機...続きを読む

2015.02.06HTMLコーディング

【デザイン】フード&ドリンクのメニューデザインまとめ

先日、レストランの店舗様のWEBサイトやメニュー表、名刺などのデザインワークスを手掛けさせていただくことになりました。 今日は、フードやドリンクのメニューデザインで参考になったデザインワークスのまとめです。 Discover YOUR WAY Cafe - Patra...続きを読む

2015.02.15インスピレーション

【デザイン】ポップでグラフィカルなシングルページデザインのWEBサイトまとめ

WEBサイトのコンテンツ(内容)を1ページに収めて掲載をするシングルページデザイン。コンテンツが多い分、ページは縦に長くなってしまいますが、その長さを生かしてデザインされたポップでグラフィカルなWEBサイトをまとめてみました。 Chilicongraphic デザイン...続きを読む

2015.02.15インスピレーション