博客园添加鼠标点击样式

jquery实现鼠标点击网页，彩色气泡动画。
size：气泡初始大小（逐渐变小）
num:气泡数量

 

<script type="text/javascript">
var size=40;
var num = 10;
jQuery(document).ready(function($) {
    $("body").click(function(e) {
        var COLOURS = [ '#00B4FF', '#8300FF', '#00FF98', '#00B8FF', '#F3FF00', '#00FF0A', '#FF0055' ];
        for(var i=0;i<num;i++){
            var $i = $("<div/>");
            var x = e.pageX-size/2,
            y = e.pageY+size/2;
            $i.css({
                "z-index": 99,
                "top": y - 20,
                "left": x,
                "position": "absolute",
                "font-weight": 900,
                "height":size,
                "width":size,
                "background-color":COLOURS[Math.floor(Math.random()*COLOURS.length)],
                "border-radius":size/2
            
            });
            $("body").append($i);
            $i.animate({
                "top": y + Math.random()*360-180,
                "left":x + Math.random()*360-180,
                "height":0,
                "width":0,
                "opacity": 0
            },
            500,
            function() {
                $i.remove();
            });
        }
        
    });
});
</script>