マウスアクションのテスト
TurnScopeの管理人のYUKIです。
ガチャ萌え.com様にならって、マウス操作による画像の切り替えを組み込んでみました。
ホイールの回転とマウスの左右ドラッグで画像が切り替わります。
(下記のリンク先のみ実装)
リュウナでの実装テスト(ドラッグを他ページに実装したのでこちらのページは凍結します。)
ホイールは比較的簡単だったのですが、マウスドラッグでちょっととまどいました。
と言うのも、imgタグで表示された画像のデフォルトのドラッグ動作が邪魔をして、onmousemove処理が途中でキャンセルされてしまい、連続的な移動量の算出が出来なくなってしまう為です。
このため、画像の表示方法を"img src=*"から"div style="background-image=url(*)"に変更して、デフォルトアクションのないダグを使って実現しています。
結果、imgのalt属性が使えない点や、divの領域サイズをきちんと設定する必要があるなど、困った点も・・。
imgのデフォルトのドラッグ動作をキャンセル出来ればよいのですが、今のところ方法がわかりません。
実装はしてみたものの、ホイールアクションに関しては、ガチャ萌え.com様のように、明示的に回転ページを開いた後ならともかく、通常ページでユーザー動作(スクロール処理)をフックして変更するのは好みじゃないので、封印かも。
サイト全体かページ単位で、ホイール回転による画像変更の有効、無効設定を作ったら有りかなぁ・・。
(あるいは、画像を一度クリックすると有効になる等)
また、本実装には、テンプレートとページ生成エンジンの変更も必要なので、既存ページに組み込むのはもうしばらくかかります。
最後なりましたが、チェックは、WinXP + IE6のみなので、他の環境ではエラーが出るかもしれません。(汗)
もし、不具合などあれば、教えて下さい。
【2008/06/02 21:20】
