一个有意思的鼠标点击文字特效jquery代码


Posted in jQuery onSeptember 23, 2017

今天在【幻想's Blog】看到一段比较喜欢的鼠标点击文字特效JS代码,感觉很不错就用到博客上来了!喜欢的站长也可以用一下感觉一下!

一个有意思的鼠标点击文字特效jquery代码

只需将如下JS代码放到</body>之前即可。

<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": 999999999999999999999999999999999999999999999999999999999999999999999,
      "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>

不知道为啥, WordPress 可以使用的JS代码放到 Typecho 里都失效了,郁闷呀!

这个效果一般大网站就不用了,一般用于个人博客还是不错的。

jQuery 相关文章推荐
jQuery插件FusionWidgets实现的Cylinder图效果示例【附demo源码】
Mar 23 jQuery
bootstrap+jQuery实现的动态进度条功能示例
May 25 jQuery
jQuery实现返回顶部按钮和scroll滚动功能[带动画效果]
Jul 05 jQuery
jQuery常用选择器详解
Jul 17 jQuery
jQuery实现导航栏头部菜单项点击后变换颜色的方法
Jul 19 jQuery
简单实现jQuery上传图片显示预览功能
Jun 29 jQuery
jQuery实现文字超过1行、2行或规定的行数时自动加省略号的方法
Mar 28 jQuery
jQuery访问json文件中数据的方法示例
Jan 28 jQuery
jquery实现轮播图特效
Apr 12 jQuery
基于JavaScript或jQuery实现网站夜间/高亮模式
May 30 jQuery
JQuery通过键盘控制键盘按下与松开触发事件
Aug 07 jQuery
JQuery用$.ajax或$.getJSON跨域获取JSON数据的实现代码
Sep 23 #jQuery
jQuery实现table中两列CheckBox只能选中一个的示例
Sep 22 #jQuery
解决html-jquery/js引用外部图片时遇到看不了或出现403的问题
Sep 22 #jQuery
使用jQuery实现两个div中按钮互换位置的实例代码
Sep 21 #jQuery
jQuery实现的简单动态添加、删除表格功能示例
Sep 21 #jQuery
jQuery实现可兼容IE6的滚动监听功能
Sep 20 #jQuery
jQueryMobile之窗体长内容的缺陷与解决方法实例分析
Sep 20 #jQuery
You might like
新版PHP将向Java靠拢
2006/10/09 PHP
构建简单的Webmail系统
2006/10/09 PHP
优化WordPress中文章与评论的时间显示
2016/01/12 PHP
在laravel中实现ORM模型使用第二个数据库设置
2019/10/24 PHP
js 兼容多浏览器的回车和鼠标焦点事件代码(IE6/7/8,firefox,chrome)
2010/04/14 Javascript
JavaScript对象、属性、事件手册集合方便查询
2010/07/04 Javascript
jQuery hover 延时器实现代码
2011/03/12 Javascript
javascript学习笔记(三) String 字符串类型介绍
2012/06/19 Javascript
js Math 对象的方法
2013/09/01 Javascript
JavaScript中提前声明变量或函数例子
2014/11/12 Javascript
Three.js学习之网格
2016/08/10 Javascript
JavaScript提高加载和执行效率的方法
2017/02/03 Javascript
浅析jsopn跨域请求原理及cors(跨域资源共享)的完美解决方法
2017/02/06 Javascript
ES6新特性之Symbol类型用法分析
2017/03/31 Javascript
利用js的闭包原理做对象封装及调用方法
2017/04/07 Javascript
jQuery创建及操作xml格式数据示例
2018/05/26 jQuery
微信小程序如何修改本地缓存key中单个数据的详解
2019/04/26 Javascript
[03:34]2014DOTA2西雅图国际邀请赛 淘汰赛7月15日TOPPLAY
2014/07/15 DOTA
Python+selenium 获取一组元素属性值的实例
2018/06/22 Python
查看python下OpenCV版本的方法
2018/08/03 Python
Python多线程原理与用法详解
2018/08/20 Python
Python字符串对齐、删除字符串不需要的内容以及格式化打印字符
2021/01/23 Python
Python用requests库爬取返回为空的解决办法
2021/02/21 Python
python爬虫破解字体加密案例详解
2021/03/02 Python
美国全球旅游运营商:Pacific Holidays
2018/06/18 全球购物
StubHub美国:购买或出售您的门票
2019/07/09 全球购物
环境工程大学生个人的自我评价
2013/10/08 职场文书
师范生个人推荐信
2013/11/29 职场文书
英语道歉信范文
2014/01/09 职场文书
个人充满哲理的自我评价
2014/02/20 职场文书
行政人事岗位职责
2014/03/17 职场文书
大学生第一学年自我鉴定2015
2014/09/28 职场文书
手术室护士个人总结
2015/02/13 职场文书
2015年超市员工工作总结
2015/05/04 职场文书
MongoDB数据库部署环境准备及使用介绍
2022/03/21 MongoDB
Python 操作pdf pdfplumber读取PDF写入Exce
2022/08/14 Python