動的に生成された複数のDOM要素をアニメーション化するにはどうすればよいですか?

StackOverflow https://stackoverflow.com/questions/1009816

質問

これは私がどこから来たのかを知るのに役立つかもしれません。 Jqueryは各問題をネストしました

このコードを使用してページにdivsを追加しています:

jQuery("#list").append(
    jQuery("<div>")
        .attr("id", "Entry")
        .html(html)
);

htmlは、テキストとアンカーを含む単なる文字列です。

新しいdivをアニメーション化しようとしています-#EntryというIDを持つ複数のdivがあります。

ここに私のコードがあります:

jQuery("#Entry").hover(function(){  
    jQuery(this)
    .animate({
        width:"50%",
        fontSize: "30px",
        opacity: 0.3,
        borderwidth: "15px"
    }, 500);  
});

重要な場合、上記は私のjQuery(document).ready(function(){ }関数にあります。

役に立ちましたか?

解決

まず、そのIDで複数の<div>を追加している場合、間違っています。 id属性は、ドキュメント内で一意である必要があります。同じliveを持つ複数の要素があると、Javascriptが混乱する可能性があります。同じ社会保障番号を持つ2人に相当します。 :)要素のグループに関する一般的でベストプラクティスは、すべての要素にクラスを与え、そのように選択することです。

これまでは、 mouseover 関数を調べてください。欲しいです。基本的に、準備ができたドキュメントでコードを実行すると、ドキュメントの現在の状態に対してコードが実行されます。つまり、その時点で存在する(提供されたセレクターに一致する)要素のみが、提供されたイベントにバインドされます。 mouseout関数は、これを回避する方法として作成されました。別の解決策は、新しいhoverを追加した後にバインディングコードを再度実行することですが、必要な<=>および<=>イベントをサポートする<=>を使用するほどクリーンではありません<=>を実行します。

他のヒント

live()は、最新のjQueryのカスタムイベントを含むすべてのイベントをサポートします...

ライセンス: CC-BY-SA帰属
所属していません StackOverflow
scroll top