鼠标点击自定义文字展现特效JS代码

JS特效使用方法

只需将如下JS代码放到</body>之前就好了

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": 999,
 "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();
 });
 });
});

  

原文地址:https://www.cnblogs.com/dare/p/9012737.html

时间: 2024-10-10 05:19:48

鼠标点击自定义文字展现特效JS代码的相关文章

炫酷CSS3鼠标滑过图片标题文字动画特效

这是一款使用CSS3制作的鼠标滑过图片标题文字动画特效.该特效在鼠标滑过图片的时候,会展现遮罩层,并在遮罩层上以旋转的方式使图片描述文字逐一展现. 在线预览   源码下载 使用方法 HTML结构 DEMO中使用bootstrap的网格系统来进行布局.整个图片放置在一个.box容器中,它里面的.box-content是图片的描述文本层. <div class="box"> <img src="img/1.jpg" /> <div clas

css3鼠标滑过图片文字动画特效

在线预览   源码下载 css3鼠标滑过图片文字动画特效是一款常用的5种纯css3实现的鼠标滑过图片动画效果.悬停效果有:1.鼠标悬停图片变大文字消失.2.鼠标悬停文字消失.3.鼠标悬停整体旋转.4.鼠标悬停整体旋转放大.5.鼠标悬停整体上升 加入前端爱好者QQ群(123235875) 点击加群,共同交流进度!

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

鼠标点击输入框文字消失 value实现方法  placeholder实现方法     以及JQ实现placeholder效果 <input type="text" value="请输入手机号" id="demo" class="inp-fon"> <input type="text" value="请输入银行卡号" id="demo" class=&

鼠标点击特效js代码

<script type="text/javascript"> /* 鼠标特效 */ var a_idx = 0; jQuery(document).ready(function($) { $("body").click(function(e) { var a = new Array("?富强?","?民主?","?文明?","?和谐?","?自由?",&

如何最快速的找到页面某一元素所绑定的点击事件,并查看js代码

比如我要查看银行账号这个标签所绑定的事件. 操作过程中使用的是谷歌浏览器?第一步:在该元素上右键→检查 第二步:点击Event Listeners 这样就能看到该元素绑定的所有事件了 第三步:展开click,我们可以看到该元素所绑定点击事件的方法就在 jquery-ui-1.8.16.custom.min.js的第46行和 distribute.js的第12行 第四步:分别点击进去 光标停留处就是触发点击事件时执行的方法 如果想直接打开该js文件并修改代码,可以使用快捷键Ctrl+Shift+R

鼠标点击出现爱心+社会主义价值观+随机颜色的文字+鼠标cursor自定义图片

js动画--鼠标点击出现爱心 只需将如下JS代码放到</body>之前就好了 <script type='text/javascript' src='//api.dujin.org/js/aixintexiao.js'></script> 完整代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <

[python] 1、python鼠标点击、移动事件应用——写一个自动下载百度音乐的程序

1.问题描述: 最近百度总爱做一些破坏用户信任度的事——文库金币变券.网盘限速,吓得我赶紧想办法把存在百度云音乐中的歌曲下载到本地. http://yinyueyun.baidu.com/ 可问题是云音乐中并没有批量下载,而上面我总共存了700多首音乐! 因此:有必要写一个脚本自动下载这些音乐了!!! 2.解决问题 自动下载歌曲有两种方法: JS法 模拟鼠标点击法 由于考虑到JS法需要分析网页结构.寻找下载链接,工作量有点大,于是选择用模拟鼠标点击法! 在linux上我首先想到用python来做

鼠标点击网页出现文字特效

<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" con

js鼠标点击特效,有关参数设置

效果图,用的faststone--录像--togif,黄色圆圈实际是不显示的 博客后台管理设置 本地新建一个demo.html文件,可以自行测试,要引入jquery文件哦 来个“红橙黄绿蓝靛紫”的点击特效 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script type="text/javascript" src="../js/jquer