Fx.Tween

[MooTools Tutorial]巨大な背景画像の読み込みとMoreの使い方

2009/11/11 Tutorial No comments , , ,

MooToolsには豊富な機能拡張クラス(プラグイン)があります。
公式サイトでは基本クラス群をCore、機能拡張クラス群をMoreと称してあるのでそのように覚えておくと良いと思います。
Moreクラスはコアに実装されていない機能を個別に提供するもので、
どれもCoreのクラスに依存しているのでCoreとセットでないと動きません。

Moreの公式サイトでの配布は約60種類、MooTorialに約70種類くらいあります。
大体のことは網羅されているので、そのまま活用するもよし、組み合わせて新しいプラグインを作るもよしです。

このエントリーはそんな便利なMoreクラスの使い方を説明しつつ、
Flashでやってしまいがちな横幅1000pxを越える大きな背景画像の読み込みを、MoreのAssetsクラスを使って行うチュートリアルです。
前編後編で分けていますがタイトルが違うのでご注意を。こちらは前編です。

View Demo

前編:ページ開く→ローディング画像表示と背景画像を1枚読み込み→読み込み完了で背景表示

後編:画像3枚読み込み→クロスフェードでエンドレス切替

ということをやってます。後編はこちら »
(さらに…)

[mootools] クリックした場所に線を表示する

2009/03/27 MooTools No comments

何しようとしたのか分かる人には分かってしまうかもしれないw
クリックした座標をposition:absoluteのtopまたはleftの数値に置き換えて、
画面上に1pxの線を縦横ランダムに表示します。

縦線・横線はいいけど斜線は画像使うか1px単位で要素出力とかしないとだめかーと思い至って中断。
線が流れるアニメーションにしたほうが面白いかな

canvasの存在を忘れてた

canvasでやりますた AnoRect

[mootools]クリックでフェードインアウトさせる

2008/02/23 MooTools No comments ,

ボタンやリンククリックでフェードインアウトさせるサンプル。
※このサンプルは前バージョン(1.1.2)で書いたものです。追記で1.2の解説もしてます。

(さらに…)