Jquery 和 PhP：添加动画

Question

我正在创建一个带有蓝色大按钮的随机数生成器，您可以单击该按钮。一点击，我就使用jquery和ajax提交表单，不刷新页面。我得到一个介于 0 到 100 之间的随机数。我所做的是将按钮的值替换为生成的数字。这是我的代码...

$('form.roll').on('submit', function() {
var that = $(this),
    url = that.attr('action'),
    type = that.attr('method'),
    data = {};
that.find('[name]').each(function (index, value) {
    var that = $(this),
        name = that.attr('name'),
        value = that.va();
    data[name] = value;                 
});

$.ajax ({
    url: url,
        type: type,
        data: data,
        success: function(response) {
            $(function() {
                $("#roll").val(response);
            });
        }
});
console.log(data);
return false;
});

这是按钮

<input type="submit" class="btn btn-primary btn-lg btn-block" id="roll" value="Roll Dice">

现在这似乎可行，但看起来不太好。我想为它制作动画。我想要做的是那种闪烁，停留几秒钟，然后慢慢淡出回到“掷骰子”，就像这里的动画：（只需单击超级用户并更改它，您将看到动画. http://vitalets.github.io/x-editable/demo.html

我想要的是，如果它小于 50，则闪光灯为绿色，当它滚动超过 50 时，它为红色。显示的数字类似于“29.67”。两位数，带两位小数。

我还想在处理 php 函数时添加加载 gif。

我希望这是有道理的，并且您可以帮助我。非常感谢您的宝贵时间！

Answer 1

jQuery UI 提供可能符合您需要的高光效果：http://api.jqueryui.com/highlight-effect/。颜色可定制。

用法是：

$("#number").effect('highlight', { color: 'red' });

我为你的场景编了一个小提琴：http://jsfiddle.net/QG7hE/1/