JavaScriptのQ&A

JavaScriptのQ&A

D&Dで要素の移動

[1] 質問 (わかば [sage] 2003-01-07 19:10): HTML と一緒に使って、要素を鼠で drag することにより移動するにはどうしたらいいでしょう? (つまり、 Windoze とかでタイトルバー を drag したら窓が動く、みたいなことをしたい。)

[2] わかば [sage] 2003-01-07 19:12: それっぽい属性を適当にいじったらできますた。 (SuikaWiki)/script/drag.js という URI の script file で実装しますたのでそちらをどうぞ。 WinIE (4以上?), Mozilla (Netscape 6 以上) で動くと思います。

[3] 質問 わかば 2003-01-12 14:05: Mozilla で standards compliance mode になると

 elementFoo.style.left = 123;

としても elementFoo が動いてくれません。

[4] わかば 2003-01-12 14:06: >>3 123 ではなく '123px' と指定しましょう。

[5] わかば 2003-01-15 19:13: ついで? に、 CSSposition: fixed もどきを実装してみました。 おまけで max-length: みたいなの (表示領域からはみ出たら縮小する。) も書きました。

DOM とかよく分かってないので(w)動けばいいや位の code になってます。 元々 CSS2 もまともに実装してない WinIE 対策でしかないのでそれで十分なんですが。

[33] 名無しさん 2005-03-29 08:49:42 +00:00: Mozilla で簡単に要素の箱を移動可能にする XBL 部品 <http://suika.fam.cx/www/mozilla/xbl/doc/drag-xbl>

(Gecko & WinIE に対応)

質問出来る場所

[6] 質問 (名無しさん [sage]): JavaScript について質問したいのですが、どこでするのが適当でしょうか?

[7] 名無しさん:

[21] 質問 わかば [sage]: DOM についてもここで質問していいですか?

[22] わかば [sage]: >>21 DOM の質問の場所がまだないのでここでしましょう。 いずれ JS と DOM はちゃんと分離します。 (でも JavaScript の質問が激変する予感)

XHTML で document.cookie

[10] 質問 (わかば): application/xhtml+xml にしたら document.cookie が存在しません。困っちゃいます。

[11] わかば 2003-01-22 21:45: >>10

  1. Bug 126177 - document.cookie doesn't work in files served as application/xhtml+xml <http://bugzilla.mozilla.org/show_bug.cgi?id=126177>
  2. Bug 111514 - document.body has no properties in XHTML as application/xhtml+xml <http://bugzilla.mozilla.org/show_bug.cgi?id=111514>

DOM 的には XML ではあるが HTML ではない罠。 Mozilla の開発者もどう対処すればいいのか困ってるっぽい。

document.styleSheets で要素が消滅

[12] 質問 (わかば [sage] 2003-01-23 18:23): SuikaWiki::Plugin::StyleSheet/wikiview/apply-user-preferred-style のような code で document.styleSheets をいじってスタイル・シートの切り替えやってるんですが、切り替えて HTML で指定された優先スタイル以外が選ばれる時に、なぜか文書中の要素の一部が勝手に見えなくなります。 (DOM Inspector で確認したところ、文書木はちゃんと読まれています。また、 JavaScript Console などを見てもエラーは出ません。) 消滅するのは必ずではなく何回かに一回でして、再現条件はこれ以上は分かりませんが、 body 要素の最初の方の子要素が幾つか消えてる気がします。

[13] わかば [sage] 2003-01-23 18:26: >>12 かなり手間取りましたが理由は分かりました。このスクリプトを head 要素の最後の部分に入れていたのですが、 body 要素の最後に移動したらうまくいきました。

つまり、文書全体が読み込まれた後にスクリプトを実行させないといけなかったということです。

だけどスタイル切り替え自体はうまくいっているように見えてて、実際何度かに1回はちゃんと期待通りにレンダリングされていたのですから、 Mozilla のバグですかねえ。 (それとも仕様的には Moz の実装で問題なくて、たまたま動くこともあるってだけ? よくわかんないや。)

[14] わかば [sage]: >>12-13 なんにせよ、 JavaScript の微妙な期待しない動作というのは debug が難しいですね。 DOM/Mozilla も発展途上であるのも絡んで。

document.styleSheets に出ない

[15] 質問 (名無しさん): WinIE 6.0 を使っていますが、 stylesheet alteraterel に指定したスタイル・シートが document.styleSheets の一覧でなぜか取得できません。

[16] >>15: 調べてみたら rel="stylesheet " でもだめでした。

[17] >>15-16: M$ 的には仕様だと思います... link 要素をいじれば同じことはできるとは思いますけど...

[18] わかば: >>17 面倒なので SuikaWiki では M$IE には必ず (代替スタイルも含めて) stylesheet で送るようにしました。 (邪道かな。)

[23] 質問 わかば: XHTML だと document.styleSheets が使えません。

[24] わかば [>>23]: 代わりに document.getElementsByTagName('link') 云々を使いましょう。 (xml-stylesheet もチェックしないと。面倒だな。)

そもそも document.styleSheets は DOM0 らしいので実装していない UA もあるかもしれません・・・あるのか?

[25] わかば: >>24 それつかったけど Mozilla ではうまくいかないなあ。よくわからん。

[26] >>24-25: Bookmarklet (>>21)-34 も参照。 調子に乗るとブラウザが落ちるので注意。

document.createStyleSheet を使うと落ちる

[19] 質問 (わかば 2003-01-25 11:05): document.createStyleSheet() を使うと WinIE6 が落ちました。

[20] わかば: >>19 MacIE 4.5 も落ちるそうです。 (DHTML Lab - dhtmlab.com - Dynamic Headline Fader, Version 2.01 - WebReference.com <http://www.webreference.com/dhtml/column25/addendum1/fdr201iemac2.html>)

諦めた方が早いでしょう。 Mozilla には存在しないみたいですし。

CSS 算出値の取得

[27] 質問 (名無しさん): CSS算出値を取得するにはどうしたらいいですか?

[28] >>27: (DOM2)

 var styleList = element.ownerDocument.defaultView.getComputedStyle (element, );
 alert (styleList.getPropertyValue ('width'));

こんな感じ。

[29] 名無しさん: なお、算出値はあくまで CSS 的算出値なので、実際に使われている値とは限らない。例えば >>28 の例で帰ってくる値は auto だったりする。 (使えねー)

[30] 名無しさん: WinIE では >>28 は駄目ですね。

友達からもらった HTML のスクリプトが実行されません

[31] 質問 (名無しさん): 知人から Windows Messanger で送られてきた HTML 文書にスクリプトが含まれているのですが、 WinIE で実行できません。なぜか「制限付きサイト」ゾーンになっています。

[32] 名無しさん: Windows XP SP2 だとセキュリティの強化とやらで、そういう仕様なのだそうです。

その HTML 文書のファイルのプロパティに、ブロックの解除なるボタンが出てきますので、それを押すと普通に実行されるようになるはずです。

新しい質問の追加