― MozillaZine.jp フォーラムは Mozilla 製品に関する情報交換の場です ―



掲示板トップ » その他の話題 » web 標準

All times are UTC + 9 hours

返信する
ユーザー名:
件名:
オプション:
BBCode: ON
[img]: ON
[flash]: OFF
[url]: ON
スマイリー: ON
BBCode を無効にする
フォントサイズ:
フォントカラー
スマイリーを無効にする
URL を自動的にパースしない
ユーザエージェントを表示する
認証コード
KCaptcha by Nikita_Sp
   

トピックのレビュー - mousedown時のイベント順序がChromeと異なる
作成者 メッセージ
Masayuki
  記事の件名:  Re: mousedown時のイベント順序がChromeと異なる  引用付きで返信する
tuneoogawa さんが書きました:
論点としては、
mouseup時、マウスがボタンのエリア内にとどまったままmouseupする場合は、
Firefoxの動きはChromeと同じである。ということです。

具体的には、mouseup時の上記の場合、DOMイベントの前にボタンは初期状態（最初の状態）に戻る。
とFirefoxは振舞います。

前提であるCSSの疑似クラスの適用をそのイベントのデフォルトのアクションのひとつだと考えると、
イベントのデフォルトのアクションはキャンセルできません。そもそもキャンセルすることは想定されていないから
之でいいという考えもありますが。

私の確認の仕方が悪いのでしょうか？


ソースを見た限り、全てのコンテンツがmouseupイベントを処理した後にFirefoxはactive状態を解除しています。まさか、alert()で確認しようとされていますか? alert()はモーダルダイアログを作り出してしまうので検証には使えませんよ?

ちなみに、ソースで見た感じ、mousedownをpreventDefault()するとactiveになるのをキャンセルできますが、mouseupをpreventDefault()してもactiveは必ず解除され、またマウスキャプチャもリリースされるようになっていました。

tuneoogawa さんが書きました:
過去に議論し尽くされた問題であれば、ご容赦ください。


www-dom@w3.orgに投稿すべき内容だと思いますよ。
投稿記事 Posted: 2011年8月26日(金) 10:43
tuneoogawa
  記事の件名:  Re: mousedown時のイベント順序がChromeと異なる  引用付きで返信する
そうですね、
レンダリングエンジンという意味では、現在のところGeckoは信頼性が高いのは同意します。

上で、
「具体的にDOMイベントとCSSの疑似クラスとの間にルールはない」
との事ですので、ルールを明確に作って、ブラウザの差異がなくなればいいなと。

アプリケーションを書いてる側にとって、この差異を回避するトリックを考え出すのは
車輪の再発明と思います。

私の私見ですが、
「CSSの疑似クラスは、DOMイベントに優先する」というものです。
これは単に、アプリケーションを書いたときの順序として、こちらの方が簡単だと思うのです。

たとえば、ボタンを押して何かが動く場合で、かつ動く処理に時間を要する場合において、
現在のFirefoxの順序だと、処理を動かすためのトリックを少し書かなければいけません。

これまでJavascript　Nativeでアプリケーションを書いてきた中で、
イベントをキャンセルする場面は、これまで１度しか無く、windowに対する
mousedownイベント時のみです。

むしろFirefoxのイベント順序をひっくり返す側の処理を書いてきました。

私の経験が少ないだけなのか、そもそもの私のアプリケーションの
作り方がおかしいのかもしれませんので、皆さんの経験が聞きたいです。
投稿記事 Posted: 2011年8月26日(金) 07:48
aides
  記事の件名:  Re: mousedown時のイベント順序がChromeと異なる  引用付きで返信する
関連するかは不明ですが、以下のフォーラムにonmouseに関係する比較とバグ報告が寄せられてます。

* CSSでスクロールバーの表示/非表示を切り替えた際、レイアウトが崩れる - Google Chrome 公式ヘルプフォーラム

Webkit特有のバグとの事ですが、こう云う事からもGeckoに信頼性を寄せたいですね。
投稿記事 Posted: 2011年8月25日(木) 23:26
tuneoogawa
  記事の件名:  Re: mousedown時のイベント順序がChromeと異なる  引用付きで返信する
アドバイスをありがとうございます。

少し早とちりして間違えました。ご指摘の通り
マウスがボタンのエリア外(mouseout)にでてた場合は、
こちらは、firefoxの方がアプリケーションを作る上では自然な順序に思われます。

論点としては、
mouseup時、マウスがボタンのエリア内にとどまったままmouseupする場合は、
Firefoxの動きはChromeと同じである。ということです。

具体的には、mouseup時の上記の場合、DOMイベントの前にボタンは初期状態（最初の状態）に戻る。
とFirefoxは振舞います。

前提であるCSSの疑似クラスの適用をそのイベントのデフォルトのアクションのひとつだと考えると、
イベントのデフォルトのアクションはキャンセルできません。そもそもキャンセルすることは想定されていないから
之でいいという考えもありますが。

私の確認の仕方が悪いのでしょうか？

これに対し、Chromeでは、「CSSの疑似クラスの適用のアクションの後に、eventListenerのDOMイベントが補足できる」というものです。

つまり、仕様が一貫しているように見受けられます。

前々から気になっていましたが、このたびChromeで確認してみると、靄（もや）が晴れた気分になりました。

過去に議論し尽くされた問題であれば、ご容赦ください。
投稿記事 Posted: 2011年8月25日(木) 19:52
Masayuki
  記事の件名:  Re: mousedown時のイベント順序がChromeと異なる  引用付きで返信する
具体的にDOMイベントとCSSの疑似クラスとの間にルールはないので私見ですが……

mousedownの件、具体的にDOMイベントとCSSの疑似クラスとの間にルールはないので私見ですが、私はFirefoxの挙動の方が自然に思えます。いくつかのDOMイベントは、preventDefault()でデフォルトの動作をキャンセルすることができますが、CSSの疑似クラスの適用をそのイベントのデフォルトのアクションのひとつだと考えると、それをキャンセルできない(既に実行してしまっている)Google Chromeの動作の方がおかしいと思います。実際にFirefoxで:activeをキャンセルできるかどうかは知りませんが、あくまで順序としては、の話。

mouseupの件はCSSの仕様書見る限り、Firefoxの方が正解だと思いますが。
http://www.w3.org/TR/css3-selectors/#th ... -hover-act

ボタン上でmousedown、カーソル移動して、一度外へ、カーソルをボタンの上に戻してmouseup、これでもclickイベントは発生しますので(これは仕様通り)、その間ずっとボタンはactiveだと考えるのが普通ではないでしょうか。
投稿記事 Posted: 2011年8月25日(木) 14:44
tuneoogawa
  記事の件名:  Re: mousedown時のイベント順序がChromeと異なる  引用付きで返信する
イベント順序がChromeと異なる続き

mouseup時のイベント順序がChromeと異なる

mouseup時、マウスupがボタンのエリア内にとどまったままmouseupする場合は、
Chromeと同じであるが、マウスupがボタンのエリア外(mouseout)にでて
mouseupする場合は、mouseoutの振る舞いがChromeと異なる。

これも、Cheomeの方がアプリケーションを作る上では自然な順序に思われます。

１．Chrome
mouseout時にCSSで規定した初期状態にもどる

２．Firefox
mouseout時にCSSで規定した初期状態にもどらない

<!DOCTYPE HTML>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type='text/css' media='screen'>
#b1 {
position: absolute;top: 9px; left: 10px; width: 155px; height: 35px;
}
#b1:active {
top: 21px; left: 11px;
}
</style>
</head>
<body>

<input type="button" id="b1" value="Aqua 2"/>

<script language="JavaScript">
var elm = document.getElementById("b1");
elm.addEventListener("mouseup",_mouseUp,false);
function _mouseUp() {alert("_mouseUp");}
</script>

</body>
</html>
投稿記事 Posted: 2011年8月24日(水) 17:04
tuneoogawa
  記事の件名:  mousedown時のイベント順序がChromeと異なる  引用付きで返信する
以下のコードで、mousedown時のイベント順序がChromeと異なります。
CSSはオブジェクトの振る舞いを規定するので、
Chromeの順序がアプリを書く上では簡単な気がしています？

操作と振る舞い
１．Chrome
（１）Aqua2というボタンをmouseで押下
(2)Aqua2というボタンがactiveで示した座標に移動
(3)alert("_mouseDown")がポップアップ

2．Filrefox
（１）Aqua2というボタンをmouseで押下
(2)alert("_mouseDown")がポップアップ
(3)ポップアップ状態でmouseを押下したままでenterキーを押すと
　Aqua2というボタンがactiveで示した座標に移動

eventListenerとCSSでは、イベント順序としてdefaultはオブジェクトの振る舞いを
規定するCSSが先で有るべきの様に思います。


<!DOCTYPE HTML">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type='text/css' media='screen'>
#b1 {
position: absolute;top: 10px; left: 10px; width: 155px; height: 35px;
}
#b1:active {
top: 21px; left: 11px;
}
</style>
</head>
<body>
<input type="button" id="b1" value="Aqua 2"/>

<script language="JavaScript">
window.addEventListener("mousedown",_mouseDown,false);
function _mouseDown() {alert("_mouseDown");}
</script>

</body>
</html> :shock:
投稿記事 Posted: 2011年8月22日(月) 13:07

掲示板トップ » その他の話題 » web 標準

All times are UTC + 9 hours


ページ移動:  
Powered by MozillaZine.jp® Forum Software © phpBB Group , Almsamim WYSIWYG
Japanese translation principally by ocean