随机为图像分配值,然后传递动画

时间:2013-09-13 14:04:42

标签: javascript jquery html css

我正在寻找创建一个包含所有图像的数组,然后我想为一个随机图像分配一个介于1到10之间的值。它最终得到的值将是以秒为单位的定时倒计时,直到我的Jquery动画为止跑。然后代码将反复循环,直到该人离开该页面。

所以我是Jquery的新手,但是我尽力让自己的头脑,所以这是我的图像数组和随机选择器;

var iconImgs = new Array('star','coffee','picture','code');
var max = iconImgs.length;
var num = Math.floor((Math.random() * max));

然后我需要选择1到10之间的随机时间;

Math.floor((Math.random()*10)+1); 

这是我需要选择的图像以及随机时间将这些放在一起然后运行我的动画所需要的硬件(注意我不希望它在运行中运行但它是我让它工作的唯一方法)。

$(document).ready(function () {
$(".icon").mouseenter(function () {
    $(this).effect("bounce", {
        times: 1
    }, 400);
    });
});

我制作了一个JSFiddle测试区 - http://jsfiddle.net/UQTY2/167/

2 个答案:

答案 0 :(得分:2)

试试这个

var iconImgs = new Array('star','coffee','picture','code');
var max = iconImgs.length;
var times = Math.floor((Math.random()*10)+1);

$(document).ready(function () {

    setInterval(function () {
        var num = Math.floor((Math.random() * max));

        $("."+iconImgs[num]+"-icon").effect("bounce", {
            times: times
        }, 400);
    }, 400);

});

的jsfiddle: http://jsfiddle.net/UQTY2/168/

答案 1 :(得分:1)

首先确保将随机时间存储在变量中:

var times=Math.floor((Math.random()*10)+1); 

然后在你的函数中,而不是mouseenter只是激发效果:

$(document).ready(function () {
    $("."+iconImgs[num]+"-icon").effect("bounce", {
        times: times
    }, 400);
});