问题可能是由于.on()或其他脚本冲突。我零想法。

工作:这是jsFiddles http://jsfiddle.net/ZtpEU/70/上的脚本
不工作:这是实时代码:http://designobvio.us/test/middle.php

这两个都是相同的代码。但是,在实时站点上,页面底部的jquery脚本不会执行。有谁知道在哪里制造冲突?因为我创建脚本后从小提琴中逐字复制了脚本。

的HTML

<ul id="videos">
    <li><a href="#">shit swag people say</a></li>
    <li><a href="#">imdabest</a></li>
    <li><a href="#">jersey shore audition</a></li>
    <li><a href="#">rifle burs</a></li>
    <li><a href="#">mvc3: best combos dat ass</a></li>
    <li><a href="#">snacks</a></li>
</ul>​


的CSS

ul#videos > li > a
{
    opacity: .5;
    color: #222;
    text-decoration: none;
}

ul#videos:hover > li > a
{
    opacity: .3;
    text-shadow: 0px 0px 6px #bbb;
    color: #bbb;
}

ul#videos > li:hover > a
{
    opacity: 1;
    text-shadow: none;
    color: #222;
}


脚本

$("ul#videos li a").on('mouseenter', function() {
    $(this).animate({"padding-left": "50px"}, "normal");
});

$("ul#videos li a").on('mouseleave', function() {
    $(this).stop(true).animate({"padding-left": "0px"}, "slow");
});​


最佳答案

看来您的即时版本的第59行有不可打印的字符。它在分号之后但在换行符之前。将您的JS复制/粘贴到jsbeautifier中或对其进行消毒。这为我解决了:

$(document).ready(function () {
    alert('hello');
    $("ul#videos li a").on('mouseenter', function () {
        $(this).animate({
            "padding-left": "50px"
        }, "normal");
    });
    $("ul#videos li a").on('mouseleave', function () {
        $(this).stop(true).animate({
            "padding-left": "0px"
        }, "slow");
    });
});

关于jquery - 与不在实时站点上执行的jQuery脚本冲突,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/10568663/

10-11 23:25
查看更多