1

だから私は次のコードを持っています。

<script src="http://jamesleist.com/wp-content/uploads/2013/01/js/jquery-1.7.2.min.js" type="text/javascript"></script>
<script>
    $(document).ready(function() {
        $('.me').hide();
        $('.clickme').click(function() {
            $(this).next('.me').animate({
                height: 'toggle'
            }, 500);
        });
    });
</script>    

<div class="clickme" style="background-color: #333333; color: #FFFFFF; padding: 10px; width: 200px; cursor:pointer;">
  Click here to toggle me in and out =)
</div>
<img class="me" src="http://www.randomsnippets.com/wp-content/uploads/2011/04/2.png" alt="It&#039;s me....ah!!!" title="Allen Liu" width="100" height="77" class="alignnone size-full wp-image-552" style="border: none;" />

<div class="clickme" style="background-color: #333333; color: #FFFFFF; padding: 10px; width: 200px; cursor:pointer;">
  Click here to toggle me in and out =)
</div>
<img class="me" src="http://www.randomsnippets.com/wp-content/uploads/2011/04/2.png" alt="It&#039;s me....ah!!!" title="Allen Liu" width="100" height="77" class="alignnone size-full wp-image-552" style="border: none;" />

単独で実行すると問題なく動作しますが、これをメイン サイトに実装すると動作しません。

以下の URL で、私が実装を試みた場所を確認できます。

http://jamesleist.com/portfolio

それは本当に私を混乱させます:-(ちなみに私はWordpressを使用しており、jQueryはheader.phpファイルでリンクされています。

これはWordpressの問題だと思いますか？

ご協力いただきありがとうございます。

4

3 に答える 3

2

.me次の要素ではありません、次の要素は画像を含む段落ですか？

$(document).ready(function() {
    $('.me').hide();
    $('.clickme').on('click', function() {
        $(this).next('p').find('.me').animate({
            height: 'toggle'
        }, 500);
    });
});
于 2013-03-10T20:27:42.977 に答える
0

タグimgには2つのclass属性が定義されています。これが100％の原因かどうかはわかりませんが、間違いなく修正する必要があります。

このような：

<img class="me alignnone size-full wp-image-552" src="http://www.randomsnippets.com/wp-content/uploads/2011/04/2.png" alt="It&#039;s me....ah!!!" title="Allen Liu" width="100" height="77" style="border: none;" />
于 2013-03-10T20:26:34.407 に答える
0

画像には「クラス」が2回定義されていますが、それはできません。'me'クラスを含むすべてのクラスを、スペースで区切られた1つのクラス宣言内に含める必要があります。バリデーターを簡単に実行すると、エラーが非常に明確に示されます。

また、スクリプトの内部と外部の両方をページの下部に移動して、domがスクリプトの読み込みを待機しないようにすることも検討します。すべてのインラインスタイルをスタイルシートに移動することも良い考えです。そうすれば、コードを読みやすく、デバッグしやすくなります。

于 2013-03-10T20:32:13.007 に答える