Question

（Javascript / jQuery newbie）

我正在练习将我的所有Javascript放入单个.js文件（它是一个小型的个人网站），并且当特定的身体#div存在时，我试图触发特定的功能。（我将代码基于One JS File for Multiple Pages，但可能有更好的方法来编写代码。）

出于某种原因（可能在尝试访问另一个＃home1时），动画将无法运行。我可以在动画之前获得一个警报，但是实际的动画功能有问题。

提前致谢。

HTML：

<script type="text/javascript" src="javascript/jquery-1.11.1.js"></script>
<script type="text/javascript" src="javascript/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="javascript/script.js"></script>

<link href="css/hover/css/hover.css" rel="stylesheet" media="all">
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>

<body id="home">

    <div class="container">
        <p>Website content here</p>
    </div>

    <div class="footer">
        <div id="home1"></div>
        <div id="home2"></div>
    </div>

</body>

CSS：

#home1 {
    position: relative;
    top: -400px;
    margin-left: auto;
    margin-right: auto;
    width: 40px;
    height: 40px;
    background-color: yellow;
}

JS：

$(document).ready(function() {

    if ($("body#home").length > 0) {

       //alert("dhd");

       $("#home1").animate({
             top: '0px';
       }, 1000, 'easeOutBounce');
    }
});

Answer 1

时出错

$("#home1").animate({
             top: '0px';
       }, 1000, '

删除顶部后面的分号：＆＃39; 0px＆＃39;

JS小提琴示例：http://jsfiddle.net/W3GBV/

无法获取jQuery动画功能

1 个答案: