【代码】JavaScript实现点击鼠标显示文字特效

2021-05-16 19:09:30  阅读 1909 次 评论 0 条


代码:

$(function () {
    var a_idx = 0, b_idx = 0;
    c_idx = 0;
    jQuery(document).ready(
        function ($) {
            $("body").click(function (e) {
                var a = new Array("富强", "民主", "文明", "和谐", "自由", "平等", "公正", "法治", "爱国", "敬业", "诚信", "友善");//显示的文本
                var b = new Array("#09ebfc", "#ff6f6f", "#ffc61b", "#51ff65", "#5197ff", "#a551ff", "#ff51f7", "#ff518e", "#9f0010", "#666666");//颜色
                var c = new Array("12");
                var $i = $("<span/>").text(a[a_idx]);
                a_idx = (a_idx + 1) % a.length;
                b_idx = (b_idx + 1) % b.length;
                c_idx = (c_idx + 1) % c.length;
                var x = e.pageX, y = e.pageY;
                $i.css({
                    "z-index": 999999,
                    "top": y - 20,
                    "left": x,
                    "position": "absolute",
                    "font-weight": "bold",
                    "font-size": c[c_idx] + "px",
                    "color": b[b_idx]
                });
                $("body").append($i);
                $i.animate({ "top": y - 120, "opacity": 0 }, 1200, function () { $i.remove(); });
            });
        });
})



微信扫码查看本文
本文地址:https://www.yangguangdream.com/?id=2139
版权声明:本文为原创文章,版权归 编辑君 所有,欢迎分享本文,转载请保留出处!

发表评论


表情

还没有留言,还不快点抢沙发?