墨吻

发表文章数:256

首页 » 技术交流 » 【网站美化】为你的网站添加鼠标点击特效

【网站美化】为你的网站添加鼠标点击特效

如上图所示效果(图片内的代码排版有问题,同学们不要模仿),

我们想要的特效可以自行更换,可更换为字符,文字等。

添加起来也不难,只需要将下述代码粘贴至你网站的全局footer.php文件(页脚文件)中即可,详细步骤不做表述。(跟上一个帖子差不多可以链接到看一下https://www.coets.cn/1573.html

代码贴在下面了,其实网上有很多种教程。要善于发现,善于搜索,善于利用。\善于搬砖\

<script type="text/javascript">
/* 鼠标特效 */
var a_idx = 0;
jQuery(document).ready(function($) {
    $("body").click(function(e) {
        var a = new Array("❤","❤","❤","❤","❤","❤","❤","❤","❤","❤","❤","❤","❤","❤");
        var $i = $("<span></span>").text(a[a_idx]);
        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": "rgb("+~~(255*Math.random())+","+~~(255*Math.random())+","+~~(255*Math.random())+")"
        });
        $("body").append($i);
        $i.animate({
            "top": y - 180,
            "opacity": 0
        },
        2500,
        function() {
            $i.remove();
        });
    });
});
</script>

排版应该没问题。

我是老墨吻,记得收藏墨吻博客

未经允许不得转载:作者:墨吻, 转载或复制请以 超链接形式 并注明出处 墨吻博客
原文地址:《【网站美化】为你的网站添加鼠标点击特效》 发布于2020-09-30

分享到:
赞(0) 生成海报

评论 2

评论前必须登录!

  注册

  1. #1

    没有你说的这个文件

    muzeys4周前 (10-03)

长按图片转发给朋友

切换注册

登录

忘记密码 ?

您也可以使用第三方帐号快捷登录

Q Q 登 录
微 博 登 录
切换登录

注册