鼠标点击文字特效

之前看到有人的博客里鼠标点击的时候会出现文字的特效,当时非常心动,所以经过一番搜索,找到了这段代码,代码如下,将其插入到footer.php 中就行:

<script type="text/javascript">
    /* 鼠标特效 */
    var a_idx = 0;
    jQuery(document).ready(function ($) {
        $("body").click(function (e) {
            var a = [
                 "老婆", "爱你", "么么哒"
            ];
            var b = [
                "#FFF68F", "#FFBBFF", "#FF0000", "#FF00FF", "#F08080",
                "#008000", "#7FFFAA", "#0000CD", "#0000FF", "#080808"
            ];
            var a_index = Math.floor((Math.random() * a.length));
            var b_index = Math.floor((Math.random() * b.length));
 
            var color = b[b_index];
            var $i = $("<span/>").text(a[a_index]);
            /* a_idx = (a_idx + 1) % a.length; */
            var x = e.pageX,
                y = e.pageY;
 
            $i.css({
                "z-index": 999999999999999999999999999999999999999999999999999999999999999999999,
                "top": y - 20,
                "left": x,
                "position": "absolute",
                "font-weight": "bold",
                "color": color,
            });
            $("body").append($i);
            $i.animate({
                "top": y - 180,
                "opacity": 0
            }, 1500, function () {
                $i.remove();
            });
        });
    });
</script>
 

:huaji3:效果如首页所示,文字颜色啥的都可以自己修改,不需要使用插件,还是比较方便的

点赞

发表评论

电子邮件地址不会被公开。必填项已用 * 标注