ボタンアクションの落とし穴 | デザインってオモシロイ -MdN Design Interactive-
【サイトリニューアル!】新サイトはこちらMdNについて


Webデザインには、あなたの知らない「落とし穴」がたくさん。大きなものから小さなものまで、それが及ぼす影響はさまざまだ。カンペキだと思っているあなたのサイトも、実はすでに暗い穴の中かも・・・。




ボタンアクションの落とし穴



 フラッシュのボタンアクション「rollover」、「rollout」を併用して使うことはよくあると思う。しかし、このふたつのボタンアクションのみ指定して何らかの命令を出しているとき、このアクションを仕込んだボタンに対してユーザーがマウスを押し続けたままボタンの領域外でクリックをはずした場合、思っていた動きとは別の動きになってしまう可能性がある。

 これは、ユーザーがこの動作をした場合、「rollout」の命令が作動せず、「rollover」の命令が残ったままになってしまって引き起こる現象である。

 この場合、「rollout」とともに“マウスを押し続けたままボタンの領域外でクリックをはずした場合”という意味に相応する「releaseOutside」【1】という命令も入れておく必要がある。

 ユーザーの動作によって左右されないコンテンツづくりを目指して問題を引き起こしそうな個所はうまく対応していこう。


on(rollover){
//目的の動きのスクリプトを記述
}

on(rollout,releaseOutside){
//目的の動きのスクリプトを記述
}
【1】「releaseOutside」を入れておけばユーザーがマウスを押し続けたままボタンの領域外でクリックをはずしても、誤作動を引き起こすことはなくなる

解説:横山 剛

(※本文中、及びキャプション内で使用している「<」、「>」は、全角になります。ご注意ください。)



twitter facebook このエントリーをはてなブックマークに追加 RSS
【サイトリニューアル!】新サイトはこちらMdNについて

この連載のすべての記事

アクセスランキング

8.30-9.5

MdN BOOKS|デザインの本

Pick upコンテンツ

現在