カーソル - Edge Animateのチュートリアル

このレッスンでは Edge Animate で ステージ上に配置する要素に対して 設定できるプロパティのうち カーソルについて解説していきます。 それでは、実際に画面を見ながら 確認していきましょう。 まずは、今後の解説のために あらかじめステージ上に 要素を置いておきましょう。 設置する要素は どれでも大丈夫なのですが ここでは、イメージがつきやすいように ダウンロードした画像ファイルの cursor.png を利用しましょう。 今回はそのファイルを ステージ上に直接ドラッグして ライブラリに取り込みます。 このように、ステージに表示されたら この要素をクリックして 選択状態にしておきます。 これで準備は完了です。 カーソルプロパティでは ステージ上に設置した要素に対して マウスカーソルを要素上に持って行ったときに 表示させるマウスカーソルの形状を 指定することが出来ます。 Edge Animate のステージ上では 何も起こりませんが ブラウザーなどで閲覧した際には 有効になります。 今回は、動作のイメージがし易いように ボタンのデザインの画像を設置しています。 それでは 早速設定していきましょう。 カーソルの設定は「プロパティ」パネルの この部分で設定できます。 ほかのプロパティと違って 右端にある、現在「auto」と 書かれているボタンしかありません。 とてもシンプルです。 このボタンをクリックすると 「カーソル選択」パネルが表示されます。 それではクリックしてみましょう。 このように、カーソルの形状が リストアップされたパネルが開きました。 ここで好きな形状を選択するだけで 設定は完了です。 ここでは、ボタンを押せますよという意味で この手のカーソルを選択します。 すると、先ほど「auto」と 書かれていたボタンに その手のカーソルが反映されました。 これで設定は完了です。 早速ブラウザでプレビューをしてみましょう。 ブラウザでプレビューするには アプリケーションメニューの「ファイル」＞ 「ブラウザーでプレビュー」を選択します。 そして、このボタンの上に マウスを持っていくと このように、マウスカーソルが先ほど選択した 手のカーソルに変わりました。 ちなみに、設定を元に戻すには 先ほどのパネルから auto を選択すれば OK です。 やってみましょう。…