鼠标点击的时候出现 "双心心" 的效果
设置步骤
点击博客园的 【管理】 → 【设置】 → 一直往下拉, 找到 【页首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
鼠标点击的时候出现 "双心心" 的效果的更多相关文章
- 使用原生JS,实现鼠标点击爱心效果 !!!
使用原生JS,实现鼠标点击爱心效果 !!! 引言: 在很多时候我们都需要实现鼠标点击出现图案或者文字这样的效果,对于用户而言,这样的体验是很极致的.其实实现起来也很简单,下面一起来学习一下吧.文末附上 ...
- html5中canvas的使用 获取鼠标点击页面上某点的RGB
1.html5中的canvas在IE9中可以跑起来.在IE8则跑不起来,这时候就需要一些东西了. 我推荐这种方法,这样显得代码不乱. <!--[if lt IE9]> <script ...
- 工作当中实际运用(3)——js原生实现鼠标点击弹出div层 在点击隐藏
function onmou(){ var divs=document.getElementById('kefuDV');//获取到你要操作的div if (divs.style.display==& ...
- 【Unity3D基础】让物体动起来②--UGUI鼠标点击逐帧移动
背景 上一篇通过鼠标移动的代码很简单,所以看的人也不多,但是还是要感谢“武装三藏”在博客园给出的评论和支持,希望他也能看到第二篇,其实可以很简单,而且是精灵自控制,关键是代码少是我喜欢的方式,也再次印 ...
- 【Unity3D基础】让物体动起来①--UGUI鼠标点击移动
背景 首先还是先声明自己是比较笨的一个人,总是找不到高效的学习方法,目前自己学习Unity3D的方式主要是两种,一种是直接看高质量的源码,另一种是光看不行还要自己动手,自己写一些有代表性的小程序,这也 ...
- 鼠标点击输入框文字消失 value placeholder 以及JQ实现效果 (仿京东的输入框效果)
鼠标点击输入框文字消失 value实现方法 placeholder实现方法 以及JQ实现placeholder效果 <input type="text" value ...
- JS控制鼠标点击事件
鼠标点击事件就是当鼠标点击元素时,就会出现另一个窗口,类似于百度首页中右上角的“登录”这个按钮,当鼠标点击 登录时,就会出现登录窗口.大体的意思就是这样,直接上代码了,简单易懂. <!DOCTY ...
- JQuery怎么实现页面刷新后保留鼠标点击样式的方法
今天抽空研究了下鼠标点击添加样式的方法.为了防止忘记,写篇文章算是备份吧. $('ul.main-menu li a').each(function(){ if($($(this))[0].h ...
- css禁用鼠标点击事件
css禁用鼠标点击事件 .disabled { pointer-events: none; } <div class="main-container disabled"> ...
随机推荐
- Spring系列7:`autowire`自动装配怎么玩
回顾 前几篇我们介绍各种依赖依赖注入,都是显式指定的,配置明确但同时也有些繁杂和重复."很多发明的出发点,都是为了偷懒,懒人是推动社会进步的原动力".Spring 提供了自动注入依 ...
- Charles和mitmproxy代理设置
1.Charles安装: 1. windows 安装证书 2. 3. 4. 5 pc端设置: Android 手机上设置代理: 先查看pc 端的ip: 2.模拟器进入wifi,按住wifi 3. ...
- Vue+webpack配置实现多页面应用开发
为什么要配置多页面开发? · 由于单页面应用不利于SEO,对于某些资讯类网站不够友好,而多页面则能够更优的解决此问题. · 传统的多页面开发模式(如java的jsp等) 前后端耦合性大,开发效率低,代 ...
- 一条SQL更新语句是如何执行的
文章首发于公众号「蝉沐风」,认真写好每一篇文章,欢迎大家关注交流 这是图解MySQL的第2篇文章,这篇文章会通过一条SQL更新语句的执行流程让大家清楚地明白: 什么是InnoDB页?缓存页又是什么?为 ...
- CKKS Part5: CKKS的重缩放
本文翻译于 CKKS EXPLAINED, PART 5: RESCALING,主要介绍CKKS方案中最重要的技术- rescaling,重缩放技术 介绍 在CKKS的前一篇文章 CKKS Part4 ...
- Collection和Map集合
前言 集合的长度是可变的.集合存储的都是对象.而且对象的类型可以不一致. Collection集合和Map集合是所有集合的父接口. Collection接口定义 体系结构的根接口,代表一组对象,有两个 ...
- 支付宝同步请求检查appid,以及公钥,私钥是否正确
第一步:下载支付宝Demo 下载地址:https://opendocs.alipay.com/open/270/106291#%E8%BF%90%E8%A1%8C%E8%AF%B4%E6%98%8E ...
- Tomcat临时目录及java.io.tmpdir对应的目录
最近客户现场的技术支持接连反馈了一个问题:导入数据的时候,上传的excel会在服务器上生成一个临时文件,而这个临时文件都在 tomcat 的安装目录下,如果上传次数比较多的话,就会导致tomcat安 ...
- IDEA中的.iml文件和.idea文件夹作用和意义
感谢原文作者:LZHHuo 原文链接:https://blog.csdn.net/weixin_41699562/article/details/99552780 .iml文件 idea 对modul ...
- JS切割图片-滑动门效果
转载请注明来源:https://www.cnblogs.com/hookjc/ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transit ...