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标签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

您的图像已定义了两次“类”，您不能这样做。您需要在一个由空格分隔的类声明中包含所有类，包括“me”类。通过验证器的简单运行非常清楚地显示了错误。

我还会考虑将内部和外部脚本移动到页面底部，这样 dom 就不会等待它们加载。将所有内联样式移动到样式表中也是一个好主意，这样您的代码就更易于阅读和调试。

于 2013-03-10T20:32:13.007 回答