logo

  • 首页
  • 博客简介
  • 说说页面
  • 关于
  • 文章存档
    • C#教程
    • C#实战
  • 隐私政策
  • 首页
  • 博客简介
  • 说说页面
  • 关于
  • 文章存档
  • 隐私政策
您正在使用IE浏览器,部分内容可能无法显示,建议您换用更新的浏览器,请单击下载Chrome浏览器
显示屏过小,本网站无法正常显示
你处于离线状态,正在显示缓存网页
首页/ 分类:资源分享/ 【前端教程】如何实现鼠标点击爆炸特效

【前端教程】如何实现鼠标点击爆炸特效

2020年7月23日 14:06:09 吕舒君 1 百度已收录 644 次浏览

效果预览

实现方法

  • 下载下方的源文件(js)


Bomb.js


大小:16.39KB
校验信息:E-tag:51b3b3cb8c670144b4a0b6d161680cf9

  • 将源文件引入在页脚

  • 在body标签内, js文件之前写入这样的代码
<canvas class="fireworks" style="position: fixed; left: 0px; top: 0px; z-index: 99999999; pointer-events: none; width: 1189px; height: 920px;" width="2378" height="1840"></canvas>
  • 大功告成, 去预览效果吧!

优化提示

WordPress中并不建议直接在页脚添加代码, 而是建议用hook在页脚挂载代码

范例Hook(有这段代码后第二步无需做)

function add_firework()
  {
      wp_enqueue_script('bomb-js', '!!你的js文件位置!!',array(),false,true);
  }
  add_action('wp_enqueue_scripts', 'add_firework');
作者头像
吕舒君
就是本站站长(^_−)☆
提示
你已经点赞过了
上一篇文章缩略图
【新手引导】C#关键字速查表
« 上一篇文章
下一篇文章缩略图
【前端教程】防止layer.tips闪烁
下一篇文章 »
原创声明
版权声明: 本文由作者吕舒君于2020年7月23日 14:06:09原创发表.
转载请务必取得作者同意, 并附带本页面地址: https://cszj.wang/1435.html
查看作者 吕舒君 的所有文章
发表评论
account_circle
email
email
评论区
共1条回复
评论作者头像
昌昌 2020-04-11 18:22
来自浙江省杭州市电信的网友

有用👍

侧边栏
文章目录
  • 效果预览
  • 实现方法
最近文章
文章缩略图
【Windows】Windows11初体验
升级&安装 不久前,微软刚刚发布了“十年来最重要的操
文章缩略图
【Windows】如何关闭Windows的自动更新
引子 Windows的自动更新的问题已经困扰了一些用户很久了
文章缩略图
【前端教程】如何创建一个属于自己的在线思维导图网站
什么是思维导图 思维导图,英文是The Mind Map,又
文章缩略图
【信奥】Java vs C++
题面 题目描述 Java和C++两种语言的辩手都可以相互争论
文章缩略图
【信奥】收集树叶
题面 描述 给出一棵二叉树,收集并移除所有叶子,重复执行,直
最近文章
您尚未登录
底部推荐
随机文章
文章缩略图
【Windows】Windows11初体验
升级&安装 不久前,微软刚刚发布了“十年来最重要的操
站点统计
文章总数:35篇
评论总数:127条
分类总数:9个
标签总数:81个
网站运行:1995天
最后更新:2022-4-4
友情链接
搜索站 文件管理 洛谷 WordPress大学

吕舒君的博客,一个传递知识的网站!

前往本站
吕舒君的博客
一个传递知识的网站

版权所有·吕舒君(2016-2022)

酷博客(V4.1.0). Theme By 吕舒君. 网站已使用SSL加密 本页面进行了 71 次请求在 0.207 秒内加载完成, 使用了 13.02MB 的内存。