经常有同学问我怎么做到的，本论坛属于DZ当然用的是插件啦。

偶然在网上找到一个关于wordpress的特效代码，分享给大家。

WordPress 添加鼠标点击特效
实际上这种教程在网上搜索一下有一大堆，已经是各大博主玩烂的东西了。不过既然给自己的博客加上了这个，那就也凑数发一篇吧。

前两天翻相册翻到一张图，突然想起了远景论坛（前几天上去找东西来着）点击鼠标会有：“富强 民主 文明 和谐 ”的文字漂浮效果

寻思着网站这么久没更新了（主要是太懒了最近太忙了）于是想稍微折腾一下。其实很简单，就是一段Javascript而已。

最简单的方法就是直接在 WordPress 主题的 footer.php 文件中 <?php wp_footer(); ?> 的前面加上一段代码就行了。
网上一搜索也基本都是用的这方法。

<script type="text/javascript">
/*富强民主文明和谐*/
var a_idx = 0;
jQuery(document).ready(function($) {
$("body").click(function(e) {
var a = new Array("富强", "民主", "文明", "和谐", "自由", "平等", "公正" ,"法治", "爱国", "敬业", "诚信", "友善", "手麻了", "歇会儿");
var $i = $("<span/>").text(a[a_idx]);
a_idx = (a_idx + 1) % a.length;
var x = e.pageX,
y = e.pageY;
$i.css({
"z-index": 9999,
"top": y - 20,
"left": x,
"position": "absolute",
"font-weight": "bold",
"color": "#ff6651"
});
$("body").append($i);
$i.animate({
"top": y - 180,
"opacity": 0
},
1500,
function() {
$i.remove();
});
});
});
</script>

大家学会了吗？

javascript特效_如何在网页添加鼠标点击特效相关推荐

  1. WordPress主题添加鼠标点击特效

    关于WordPress主题添加鼠标点击特效方法以及代码使用.看着花里胡哨的,其实实现很简单.找到相对应的文件位置,然后复制粘贴,最后保存运行即可.为了方便新手我尽可能详细些,使用方法:打开宝塔Linu ...

  2. JS特效教程：给网站添加鼠标点击弹出指定汉字特效

    网站添加鼠标点击弹出指定汉字特效,就是鼠标点击站点任何位置,都会随机弹出我们指定的一组汉字中的一个.比如指定"文明,自由,民主,公正,和谐"等,点击鼠标时就会随机显示这一组的某个词 ...

  3. WordPress添加鼠标点击特效和粒子插件

    鼠标特效 将下面代码复制到**外观-主题编辑器-主题页脚(footer.php)**代码<?php wp_footer(); ?>上方. <script type="tex ...

  4. 网页鼠标点击特效案例收集(直播间红心同理)

    1. 鼠标点击出随机颜色的爱心 <!DOCTYPE html> <html lang="en"> <head><meta charset= ...

  5. 博客园添加鼠标粒子吸附特效

    本文从以下三个方面, 阐述在博客园添加鼠标粒子吸附特效: 一. 效果展示 二. 权限申请 三. 设置步骤 一. 效果展示 在博客园的页面, 出现鼠标粒子吸附的特效, 如图所示: 二. 权限申请 点击博 ...

  6. 博客园美化（3）博客园鼠标点击特效代码

    博客园鼠标点击特效代码 样式效果 鼠标点击出现烟花和"富强", "民主", "文明", "和谐"... 特效 使用方法 ...

  7. 鼠标点击特效：canvas点击效果

    JS代码(代码中包含了sketch.min.js的源码,如果你的网站已经引用了,请删掉下面的6到7行.): /** 鼠标点击特效:canvas点击效果*/ /* Copyright (C) 2013 ...

  8. 在鼠标点击特效上加上鼠标移动特效（一）

    ---------------------2021.3.31更新----------------------------- 补一个代码少一点的demo js代码打包下载 下载 js.7z <!D ...

  9. 鼠标点击特效：点击网站页面显示24字核心价值观上升的特效代码

    将以下代码直接写入html中即可(也可以去掉首尾,添加进js文件中,然后在html中包含这个文件) <script type="text/javascript"> /* ...

最新文章

  1. 2021年春季学期-信号与系统-第十二次作业参考答案-第六小题
  2. [C++基础]017_数据的存放
  3. 前端学习（970）：fastclick插件使用
  4. 锐炬显卡可以linux吗,Intel Broadwell桌面CPU性能测试：Iris Pro 6200核显无敌了
  5. [转载] Controller报错：java.lang.NoSuchMethodException: java.util.List.＜init＞()
  6. 第二次作业python
  7. 二极管、三极管、MOSFET管知识点总结（后端基础第二篇）
  8. QQ钱包的接入及其设计分析
  9. CTF misc图片类总结（入门级）
  10. 同态加密(CKKS)中的重线性化（Relinearization）
  11. 洛谷p1069 细胞分裂（noip2009普及组第三题，素数判断+筛法）
  12. 阿里巴巴达摩院发布2019十大科技趋势：数字身份将成为第二张身份证
  13. 什么软件测试卡路里,热量表（计算热量的仪表）_百度百科
  14. 浙江大学 找出直系亲属(java)
  15. Linux 搭建NodeBB社区，搭建CAS登录认证平台，实现Nodebb接入企业CAS认证（一）
  16. 企业如何制作自己的公司网站？
  17. 如何在鼠标右键加入自定义电源计划（如关闭睿频降温） For Win10
  18. 用python来做一个五子棋游戏，源码分享~
  19. sqlserver 截取字符串中的汉字
  20. zh-hans_windows_xp_professional_with_service_pack_3_x86_cd_vl_x14-74070.iso镜像下载

热门文章

  1. python如何对一个属性或方法进行封装_python 类、对象、方法、属性
  2. matlab解带参数的积分方程组,方程组求解问题：方程组中有带参数的积分函数，求参数...
  3. OpenXLSX 字段读取问题
  4. landscape 1
  5. 在 VC6 中使用 GdiPlus-安装
  6. java work set没有显示出来_eclipse里新建work set，将项目分组放在不同文件夹
  7. java 输出流_Java中输入输出流方法总结
  8. 【转】C# 彻底搞懂async/await
  9. 【转】WCF Data Service 使用小结 （一）—— 了解OData协议
  10. 开源干货！.NET Core + Vue.js通用动态权限(RBAC)管理系统框架[DncZeus]开源