元スレJavaScript ライブラリ総合質問所 vol.4

みんなの評価 :

前へ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 次へ

/ 要望・削除依頼は掲示板へ / 管理情報はtwitterで

151 = :

>>147
画像を切り替えてパラパラマンガのようにアニメーションさせたいのであれば
CSSスプライトな背景画像を動かす方がリクエストも少なくなるしなめらかにできるような・・・・
------------------------------------------------------------
【html】
<div class="image"></div>

【css】
.image{
width: 310px;
height: 310px;
background: url();
background-position: -2800px;
}

【js】
$(window).load(function() {
for(var i = 0; i < 9; i++){
setTimeout(switchImg, 50 * i);
}
function switchImg(){
var bgposi = parseInt($('.image').css('background-position'));
$('.image').css('background-position', bgposi+310);
}
});
------------------------------------------------------------
CSSのanimationのほうがさらに軽そうだけど。
http://codepen.io/jascha/details/sIgAo

的外れな回答だったらすんません。

152 = :

jqueryでデレゲートする時、
具体的なDOMを渡しても、同種のDOMが反応します

<div id="test"></div>
<div id="test1"></div>

$(document).on('click',document.getElementById('test'),function(e){
console.log(e.target.id);
})

これでtest1でも反応します。何故でしょうか？
testにだけ反応させたい時はどうしたらいいですか？

154 = :

ありがとうございます
取得は出来ていますが、デレゲートに失敗しているようで
div以外でも反応します
どうもdomをセレクタにすることは出来ないようです

155 = :

>>154
ドキュメントにも selector しか書いてないね
ドキュメントを読む癖をつけるといいよ
http://api.jquery.com/on/

156 = :

そもそも具体的なDOMが特定できてるんなら、delegateを使う意味というか意義がないんじゃね?

157 = :

>>156
確かに

158 = :

デレゲートには処理コストを下げるという意味もある

159 = :

どの段階の?

160 = :

>>152をjQueryを使わずに書けば無意味といわれる理由がわかると思う

161 = :

言われてみれば、対象が単独の場合はデレゲートしてもコスト下がらないですね
ありがとうございました

162 = :

あえてするんなら、そのままの構文で event.data にそのDOMが渡されてくるはずだから、
そこで違ったら return …かな(検証してない)

163 = :

>>161
無意味なのは「要素ノードをキャッシュしようとしていたから」であってdelegeteが無駄な訳じゃないよ
単一ノードでもdocumentに付け外しを繰り返しても検出できるメリットがある
キャッシュしたら参照比較なのでこのメリットを享受できない

164 = :

ちょっと意味が分かりません
例を示してもらえますか？

165 = :

>>164
jQuery(document).on('click','#test',function (e) { console.log(e.target.id); });
上記コードは意味があるが、>>152は(正常動作したとして)無意味

169 = :

jQueryのアニメーションはキューに積まれて、タイマーで逐次実行されるんだわ

.queue() を調べてみて callback関数渡す構文のやつ

170 = :

>>168
その手順だと 2. が終った後に 3. が始まるから動作が変化するけど、そこはいいの？

173 = :

>>171
>できれば汎用的な書き方

>172 に補足すると、非同期に実行される類いの処理は
たいていの場合、その種のイベントが発行されるようになっている
ES6 では promise が js ネイティブになる。
そのときにはコードも汎用的な書き方が可能になるだろう

176 = :

あ、汎用的ってのは .animate()以外の.ajax()などの非同期処理もってことか?

Deferred を使って、一つ目の.animate() が完了してから次のを設定
とするしか無いのでは .ajax() なんかもその中に入れられるし

animation関連はキュー処理だからDeferred機構とはちょっと違うんだよね
割り込もうとしたらキューに積むか >>172 か
どっちにしろjQueryのアニメーション機能に特化しちゃうね

178 = :

jqueryでハンドラを付ける時、
詳細な指定をしている方を先に実行して欲しいです
$(document).on('click','ul[data-id=moge]',～
と
$(document).on('click','ul',～
では、上の方を先に実行して欲しいです
詳細なものほど優先するのは、CSSの決定同様に合理的動作だと思いますが、
そういう調整は内部でなされているのでしょうか？

179 = :

試したところ、されてませんでした

181 = :

こいつ何回同じ質問すんだよｗ

182 = :

自分の満足できる答えにならないから
悔しいんだろｗ

関数型言語風のコードは美しいからね。
それを認めたくないんだろう。

183 = :

関数言語推しの人も同程度にうざい

184 = :

if ($('.hoge').length ){
} else {
}
でOK

187 = :

immediateじゃない場合はどこに伝播するんです？

188 = :

お隣さん

189 = :

>>184
この方法で出来ました。ありがとうございました。

190 = :

よく分からないなあ
immediateじゃないstopはどこへの伝播を止めてるんです？

191 = :

>>190
公式文書を読んでわからなければ諦める
http://api.jquery.com/event.stopimmediatepropagation/

192 = :

ありがとうございます
・stopPropagation、stopImmediatePropagation、両方ともバブルアップを止める
・stopPropagationは、その要素に対する同種のイベントは止めない
・stopImmediatePropagationは、その要素に対する同種のイベントも止める
要約するとこういうことでしょうか

193 = :

javascriptを使ってブラウザで動くパズルゲームを作りたいのですが簡潔にかけて初心者でも理解しやすいようなライブラリありませんか？

PC用にする予定なのでスマホに関してはどうでもいいです

194 = :

>>193
http://toro.2ch.net/test/read.cgi/gamedev/1048171505/

195 = :

jqueryのoffset()はウインドウ上の座標つまりウインドウ座標が返ってくるようです。
何故メソッド名がoffsetなんですか？
オフセット座標って親要素を基準にした座標のことじゃないんですか？

196 = :

英語でお願いします

197 = :

>>195
基準点が親要素であるとか、オフセットの定義に含まれて無い気がするけど。

199 = :

複数のノードを選択できるツリービューってありますか？