循环Jquery + mouseover / mouseout事件

时间:2016-08-10 11:31:15

标签: javascript animation events onmouseover onmouseout

我正在尝试使用.circulate
我希望动画停止(暂停)/继续onmouseover / onmouseout

这是来自https://css-tricks.com/examples/Circulate/

的代码
[
    {
        "title": "Illum Sed Tum Usitas",
        "field_latitude": "-64.404945",
        "field_longitude": "-32.202924",
    },
    {
        "title": "Nobis Oppeto",
        "field_latitude": "17.470493",
        "field_longitude": "47.867077",
    }
]

我试过

Chaneg the var input-text to $input_text than try 
<?php if ($input_text=='SW12'): ?>
<div id="postcode-no" class="col-lg-4 col-lg-offset-4">
    Unfortunately this is incorrect.
</div>
<?php elseif ($input_text=='SW15'): ?>
<div id="postcode-no2" class="col-lg-4 col-lg-offset-4">
    Correct.
</div>
<?php else: ?>
<div id="postcode-no2" class="col-lg-4 col-lg-offset-4">
    Some Else.
</div>
<?php endif; ?>

html:

<div id="sphere-area" >
<img src="a.png" alt="ball" id="orange-ball" />
alt="" />
</div>



Js:

function startBallOne() {
$("#orange-ball").circulate({
    speed: 4000,
    height: 100,
    width: -880,
    sizeAdjustment: 40,
    loop: true,
    zIndexValues: [1, 1, 3, 3]
});
}

但没有任何作用..

有什么想法吗?

TIA

1 个答案:

答案 0 :(得分:0)

尝试将您的JS代码放在$(doument).ready()函数中。

$(document).ready(function(){
    function startBallOne() {
        $("#orange-ball").circulate({
            speed: 4000,
            height: 100,
            width: -880,
            sizeAdjustment: 40,
            loop: true,
            zIndexValues: [1, 1, 3, 3]
        });
    }
});