元スレ+ JavaScript の質問用スレッド vol.97 +
JavaScript覧 / PC版 /みんなの評価 :
601 = :
ある小さい4つの画像の上にマウスを載せると、その左の大きな画像が切り替わるっという仕組みを作りたいのですが
IEやfirefoxでは成功するのに、googleでは成功しません。
どうしたらいいでしょうか?
ソースは下となります。
なお関係ないと思いますが、このソースは自分で作ったものではなく、このようなソースを打ち出すようにmovabletypeを設定して作られたソースです。
~
<ul id="topic_m">
<li id="p1">
<a href="./profile/" title="○○">
<img src="" alt="○○" width="300" height="80" border="0" id="topic1"
onmouseover="topic.src=''"
onmouseout="topic.src='http:○○.jpg';topic1.src='http:○○.jpg'" />
</a></li>
~
602 = :
文字コードの質問
javascriptが書かれたhtmlや~.jsは文字コードは何がいいのでしょうか?
また、utf8はphpスレで、bomなしを使うのが一般的と言ってましたが、
javascriptではどうなのでしょうか?
603 = :
PHPはhtmlやjsに埋め込んだりするだろ?
605 = :
>>601
ソース貼れ
606 = :
bomって鯖次第なんじゃないの?
607 = :
>>594
ステマうぜえ
608 = :
>>606
ファイル次第
610 = :
FTPクライアントでファイル書き替えるなよ
612 = :
1年は生きていけるんじゃね
毎年流れが変わるのがこの世界
613 = :
jqueryのbackstretchを読み込ませて背景画像をウィンドウサイズに合わせて最大表示させたいと思っています。
firefox、chromeのそれぞれ最新版ではきちんと表示されたのですがIE9だと正規の表示ができません。
画像は表示されるのですが、最大化されずbackgroundから浮いた状態で表示されてしまいます。
ローカル環境のみで使用する予定です。
私のコードが悪いのか、そもそもこのjsがIEに対応していないのでしょうか?
html内のコードは以下のものです
<head>
<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="jquery.backstretch.js"></script>
</head>
<body>
<script type="text/javascript" >
$.backstretch("3.png");
</script>
</body>
614 = :
基礎を勉強しませう
615 = :
リンクの際に動きのあるページが作りたいと思っています。
通常クリックした際に何かを反応させるためには
<a>の中にonclickなどを入れなくてはならないと思っていたのですが
http://www.wyz-design.com/#/home
こちらのサイト様では通常のリンクの記述しかしていないようです。
htmlとしてもすっきりしているので出来たら参考にしたいのですが、
ソースを見ながら作ってみてもただのリンクにしかなりません。(windows7 64bit firefox10.0.1)
どのような仕組みになっているのかご教授願います
616 = :
>>611
node.jsでライブチャット作れれば評価してやるよ
617 = :
target.onclick=function(){
処理
};
もしくは
IE以外
target.addEventListener("click", function(){
処理
}, false);
IE
target.attachEvent("onclick", function(){
処理
});
618 = :
>>615
普通にソースを見ても JavaScript で書かれた要素は出ないから。
619 = :
>>617
IE9でもattachEvent使うん?
620 = :
当たり前だろ。
Opera でも基本は attachEvent。
622 = :
後方互換
623 = :
>>622
IE9でattachEnventを使う理由になってない
624 = :
そもそも>>919のツッコミがおかしいだろ
どのみち両方記述しないといけないのに
625 = :
626 = :
OperaでattachEventを使えてaddEventListenerを使えないバージョンがあるとしてバージョンいくつまででしょうか?
また、attachEventとaddEventListenerを使えるバージョンのOperaでattachEventを採用する理由はあるでしょうか?
627 = :
>>624
どこがおかしい?
IE9はaddEventListenerを使うべきだと思うけど
628 = :
>>624-625
両方記述してもUA検出したり、attachEventを先に機能検出すればIE9でattachEventを使うことになる
629 = :
IE9になぜこだわる必要があるのかってこと
IE9で使おうが使うまいがattachEventを記述すべき話
630 = :
>>629
論点を理解してないでしょ?
両方記述する事を前提に問題になってる
631 = :
633 = :
>>631
IE9はそれまでのIEと標準準拠した全く違うものになっていて
過去のIE向けに開発されたサイトが動かないおそれがある
そのためにIE9には後方互換モードをつけている
この時使用される描画エンジンはIE9のものではないはずだ
となるとaddEventListenerは使えないかもしれない
かもしれないのは俺がXPユーザだからだ
あとはIE9持ってる人たちで確認してくれ
634 = :
>>632
- attachEvent は標準化されていません。
- attachEvent は useCapture を使えません。
- attachEvent は listener にオブジェクトを渡せません。(addEventListener は DOM 4 で渡せるようになりました)
- IE8 における attachEvent のイベントハンドラ関数実行順はランダムです。
- attachEvent は DHTML 時代の産物であり、DOM Level 2 Events と多くの点で挙動が異なります。例えば、IE8 の "submit" はイベントバブリングしません。
- Opera 11.01 の attachEvent は addEventListener のエイリアスであり、IE8 と実装が異なります。
Opera 11.01 では useCapture を使えますし、オブジェクトも渡せますし、イベントハンドラ関数の実行順も保証されます。
つまり、厳密には IE8 と Opera 11.01 で処理を分岐させる必要があります。
http://d.hatena.ne.jp/think49/20110325/1301071684
IE9 では DOM L2 Events, DOM L3 Events が取り込まれています。
http://msdn.microsoft.com/ja-jp/ie/ff468705.aspx#_DOM_Events
イベント周りの仕様は IE8 と異なるため、attachEvent を使用したとしても IE8 と IE9 で処理を分岐させる必要性はあるかもしれませんし、ないかもしれません。(後方互換性のために attachEvent だけ古い仕様にする可能性はあります)
IE9 の addEventListener と attachEvent でイベント周りの仕様差がどこまであるか、を逐一チェックする手間を考えると、addEventListener を使用する方が安全で無駄がないと思います。
>>633
"Feature detection" ならその手の問題は回避できるかと。
DOCTYPE宣言を JavaScript で読み取るのではなく、if (element.addEventListener) で。
後方互換モードにスイッチして attachEvent を使用するか、標準準拠モードで addEventListener を使用するか、ってところでしょうか。
後方互換モードにすると CSS 周りで大変なので個人的には標準準拠モードをお勧めしておきます。
635 = :
>>633
xpからバージョンアップもできないWINDOWSERはさっさと引退するかリナックスに乗り換えるかしてください
636 = :
実装主義と仕様主義の違いを垣間見た気がした。
・実装主義の人は古き実装と同じように書くことで後方互換性を保とうとする。仕様書は読まず、実際に動かした結果だけを信用する。
・仕様主義の人は仕様書を読んで仕様通りに書こうとする。次に実装の挙動を確かめてバグがあれば回避する。
どちらが現実的かはいうまでもない。
637 = :
>>618
すみません。いままで自分が素人ながらやってきたものはソースに a href="javascript:void(0)" onclick="~~と書いてきていたのでわかりませんでした。
>>617
ありがとうございます。
先ほどのサイト様ではuserAgentを取得してる関数があったので、おそらく後者なのだとおもいます。clickやonclickを見つけることができなかったのですが、まとめて書けるとわかったのでもう少し調べてみます。ありがとうございました。
638 = :
RPGのマップチップみたいなのを配置するのって、1つ配置するたびに要素を生成していくのでしょうか?
たとえば縦横30マスのマップなら30個の要素を作れって事ですか?
639 = :
>>637
該当ソースはhttp://www.wyz-design.com/nmdata/js/NMain/Mainmenu/mainmenu.js です。
http://api.jquery.com/click/ で定義しており、UA分岐処理はありません。
click の処理はhttp://code.jquery.com/jquery-1.7.1.js にあります。
640 = :
>>639
ありがとうございます!
うまく動かせるようがんばります!
641 = :
>>638
table要素を作ってもいいですし、canvasで描画してもいいと思います。
JavaScriptを利用するなら30個の要素生成はそれほど手間ではないと思いますが。
とりあえず、enchant.js のソースを参考にしてみてはどうですか?
http://enchantjs.com/ja/
642 = :
>>635
いやいや
開発ってのは一昔前の環境でやるもんだよ
一昔前の環境で動けば最新の環境でも動く確率が高いけど
その逆はそうではないからね
643 = :
>>628
検出順番おかしいだろ。addEventListenerあればaddEventListener使えよ
あと判別にUA使うなよ
644 = :
>>643
addEventListenerを先に機能検出すべき、はその通りだ
問題は>>617の時点で質問者に>>628の誤解が発生しうる事
後から正論を付け足しても当時の質問者に伝わるはずがない
645 = :
いや、UAを判別に使ってほしい
タブレットでネットサーフィンしててよくスマートフォン向けの画面が出てきてうざいからUAを変えてるけど
たまにontouchstartがあるからスマートフォンだ!と決めつけてくるサイトがあって死ねって思う
646 = :
>>645
それは間違った機能検出の使い方だし、UA検出云々ではないと思うな
スマートフォンサイトに強制リダイレクトすることが問題の本質だろう
647 = :
UA文字列による判定は、TPOにあわせて使いわける・・・のがいいよね
基本的にはプロパティ判定を使うべき(というかその方が楽で無難)
ただし、
使いたい機能が、実装されているもののバグってる
→ プロパティ判定を応用したレンダリングエンジンの判定ができないか試す
→ できなければUA文字列使うしかない
みたいに「最後の手段」として捉えたほうがいいと思う
648 = :
>>646
Googleも問題に思ってるようでちゃんと見分ける方法を公開してたりする。
http://googlewebmastercentral-ja.blogspot.com/2011/05/android.html
スレチなんでこれ以上は触れない。
649 = :
>>648
目的によって最適解が異なるはず
画面サイズの違いなら "Media Queries" を使うべきだし、JavaScript なら解像度を検出すべきだろう
Android 固有の機能ならUA検出する意義はあるかもしれないが、出来る限り in 演算子や typeof 演算子でプロパティの有無をチェックすべきだと思う
(JavaScript に関する問題ならスレ違いではないと思うが…)
類似してるかもしれないスレッド
- + JavaScript の質問用スレッド vol.95 + (1001) - [97%] - 2012/1/17 4:16
- + JavaScript の質問用スレッド vol.87 + (1001) - [97%] - 2011/6/21 6:33
- + JavaScript の質問用スレッド vol.99 + (1001) - [97%] - 2012/5/7 4:32
- + JavaScript の質問用スレッド vol.98 + (1001) - [97%] - 2012/4/9 14:46
- + JavaScript の質問用スレッド vol.96 + (1001) - [97%] - 2012/1/28 23:01
- + JavaScript の質問用スレッド vol.94 + (1001) - [97%] - 2012/1/8 15:46
- + JavaScript の質問用スレッド vol.93 + (1001) - [97%] - 2012/1/1 4:46
- + JavaScript の質問用スレッド vol.93 + (1001) - [97%] - 2011/12/10 18:31
- + JavaScript の質問用スレッド vol.90 + (1001) - [97%] - 2011/11/15 20:32
- + JavaScript の質問用スレッド vol.90 + (1001) - [97%] - 2011/10/26 4:18
- + JavaScript の質問用スレッド vol.77 + (1001) - [97%] - 2010/5/8 19:06
- + JavaScript の質問用スレッド vol.137 + (1003) - [95%] - 2019/3/26 11:46
- + JavaScript の質問用スレッド vol.127 + (160) - [95%] - 2021/7/16 9:30
- + JavaScript の質問用スレッド vol.127 + (1001) - [95%] - 2016/2/4 0:15
- + JavaScript の質問用スレッド vol.117 + (1009) - [95%] - 2014/8/5 3:30
- + JavaScript の質問用スレッド vol.107 + (1001) - [95%] - 2013/9/7 10:16
- + JavaScript の質問用スレッド vol.82 + (1001) - [95%] - 2011/1/19 7:54
トップメニューへ / →のくす牧場書庫について