设置步骤

点击博客园的 【管理】  → 【设置】 → 一直往下拉, 找到 【页首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
},
1500,
function() {
$i.remove();
});
});
});
</script>

参考链接:https://www.likecs.com/show-248909.html

鼠标点击的时候出现 "双心心" 的效果的更多相关文章

  1. 使用原生JS,实现鼠标点击爱心效果 !!!

    使用原生JS,实现鼠标点击爱心效果 !!! 引言: 在很多时候我们都需要实现鼠标点击出现图案或者文字这样的效果,对于用户而言,这样的体验是很极致的.其实实现起来也很简单,下面一起来学习一下吧.文末附上 ...

  2. html5中canvas的使用 获取鼠标点击页面上某点的RGB

    1.html5中的canvas在IE9中可以跑起来.在IE8则跑不起来,这时候就需要一些东西了. 我推荐这种方法,这样显得代码不乱. <!--[if lt IE9]> <script ...

  3. 工作当中实际运用(3)——js原生实现鼠标点击弹出div层 在点击隐藏

    function onmou(){ var divs=document.getElementById('kefuDV');//获取到你要操作的div if (divs.style.display==& ...

  4. 【Unity3D基础】让物体动起来②--UGUI鼠标点击逐帧移动

    背景 上一篇通过鼠标移动的代码很简单,所以看的人也不多,但是还是要感谢“武装三藏”在博客园给出的评论和支持,希望他也能看到第二篇,其实可以很简单,而且是精灵自控制,关键是代码少是我喜欢的方式,也再次印 ...

  5. 【Unity3D基础】让物体动起来①--UGUI鼠标点击移动

    背景 首先还是先声明自己是比较笨的一个人,总是找不到高效的学习方法,目前自己学习Unity3D的方式主要是两种,一种是直接看高质量的源码,另一种是光看不行还要自己动手,自己写一些有代表性的小程序,这也 ...

  6. 鼠标点击输入框文字消失 value placeholder 以及JQ实现效果 (仿京东的输入框效果)

    鼠标点击输入框文字消失 value实现方法  placeholder实现方法     以及JQ实现placeholder效果 <input type="text" value ...

  7. JS控制鼠标点击事件

    鼠标点击事件就是当鼠标点击元素时,就会出现另一个窗口,类似于百度首页中右上角的“登录”这个按钮,当鼠标点击 登录时,就会出现登录窗口.大体的意思就是这样,直接上代码了,简单易懂. <!DOCTY ...

  8. JQuery怎么实现页面刷新后保留鼠标点击样式的方法

    今天抽空研究了下鼠标点击添加样式的方法.为了防止忘记,写篇文章算是备份吧. $('ul.main-menu li a').each(function(){     if($($(this))[0].h ...

  9. css禁用鼠标点击事件

    css禁用鼠标点击事件 .disabled { pointer-events: none; } <div class="main-container disabled"> ...

随机推荐

  1. 科技爱好者周刊(第 175 期):知识广度 vs 知识深度

    这里记录每周值得分享的科技内容,周五发布. 本杂志开源(GitHub: ruanyf/weekly),欢迎提交 issue,投稿或推荐科技内容. 周刊讨论区的帖子<谁在招人?>,提供大量程 ...

  2. linux系统别名

    目录 一:系统别名 一:系统别名 alias 格式: alias xxx='命令' alias : 查看系统别名 alias rm='xxx' : 设置系统别名 改别名 别名 执行这个命令 [root ...

  3. K8S 权限控制访问之 rbac

    RBAC API类型 RBAC API 所声明的四种顶级类型[Role.ClusterRole.RoleBinding 和 ClusterRoleBinding].用户可以像与其他 API 资源交互一 ...

  4. springboot 添加mybatisjar包发生的异常问题?

    一.pro.xml文件中,添加mybatisjar包 <?xml version="1.0" encoding="UTF-8"?> <proj ...

  5. 计算机网络再次整理————tcp例子[五]

    前言 本文介绍一些tcp的例子,然后不断完善一下. 正文 服务端: // See https://aka.ms/new-console-template for more information us ...

  6. Mysql一个主一备

    Mysql主从复制 -- 一主一备 主从复制原理: Mysql的主从复制是mysql本身自带的一个功能,不需要额外的第三方软件可以实现,其复制功能并不是copy文件实现的,而是借助binlog日志文件 ...

  7. 原生js获取子元素

    感谢原文作者:归一山人 原文链接:https://www.cnblogs.com/guiyishanren/p/12214757.html 获取子元素的方法有 //获取第一个demo类 dom = d ...

  8. js变量类型判断 严格通用 Object.prototype.toString.call()

    Object.prototype.toString.call()判断结果: Object.prototype.toString.call(true) "[object Boolean]&qu ...

  9. PHP页面编码问题

    页面编码统一MySQL数据库编码.html页面编码.PHP或html文件本身编码要全部一致.1.MySQL数据库编码:建立数据库时指定编码(如gbk_chinese_ci),建立数据表.建立字段.插入 ...

  10. PTM人员(产品技术经理)

    以下是一位PTM的工作总结: 责任感 作为PTM一定要有责任感,项目中的所有事情都要作为自己的事情,如果碰到有些项目中的工作没人负责,那么就是PTM的工作没有做到位.   全局观 作为PTM一定要比普 ...