一个有意思的鼠标点击文字特效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实现图片跟随鼠标的实例
Oct 17 jQuery
jquery实现企业定位式导航效果
Jan 01 jQuery
轻松搞定jQuery+JSONP跨域请求的解决方案
Mar 06 jQuery
解决jquery有正确返回值但不执行success函数的问题
Aug 20 jQuery
jQuery事件blur()方法的使用实例讲解
Mar 30 jQuery
使用异步controller与jQuery实现卷帘式分页
Jun 18 jQuery
非常实用的jQuery代码段集锦【检测浏览器、滚动、复制、淡入淡出等】
Aug 08 jQuery
jQuery Datatables 动态列+跨列合并实现代码
Jan 30 jQuery
jquery css实现流程进度条
Mar 26 jQuery
jQuery带控制按钮轮播图插件
Jul 31 jQuery
Jquery $.map使用方法实例详解
Sep 01 jQuery
jquery实现抽奖功能
Oct 22 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
BBS(php &amp; mysql)完整版(七)
2006/10/09 PHP
php 常用类汇总 推荐收藏
2010/05/13 PHP
PHP的MVC模式实现原理分析(一相简单的MVC框架范例)
2014/04/29 PHP
php中使用in_array() foreach array_search() 查找数组是否包含时的性能对比
2015/04/14 PHP
php微信公众号开发之简答题
2018/10/20 PHP
PHP获取ttf格式文件字体名的方法示例
2019/03/06 PHP
CentOS7编译安装php7.1的教程详解
2019/04/18 PHP
PHP上传图片到数据库并显示的实例代码
2019/12/20 PHP
CSS(js)限制页面显示的文本字符长度
2012/12/27 Javascript
JQuery入门——用one()方法绑定事件处理函数(仅触发一次)
2013/02/05 Javascript
如何设置iframe高度自适应在跨域情况下的可用方法
2013/09/06 Javascript
Javascript 数组排序详解
2014/10/22 Javascript
JQuery实现展开关闭层的方法
2015/02/17 Javascript
AngularJS利用Controller完成URL跳转
2016/08/09 Javascript
AngularJS表格样式简单设置方法示例
2017/03/03 Javascript
Vue js 的生命周期(看了就懂)(推荐)
2019/03/29 Javascript
node.js文件操作系统实例详解
2019/11/05 Javascript
js实现右键弹出自定义菜单
2020/09/08 Javascript
vue中watch的用法汇总
2020/12/28 Vue.js
python pyenv多版本管理工具的使用
2019/12/23 Python
更新升级python和pip版本后不生效的问题解决
2020/04/17 Python
python实现PDF中表格转化为Excel的方法
2020/06/16 Python
Python接口测试环境搭建过程详解
2020/06/29 Python
css3实现超立体3D图片侧翻倾斜效果
2014/04/16 HTML / CSS
深入解析HTML5的IndexedDB索引数据库
2015/09/14 HTML / CSS
利用HTML5 Canvas API绘制矩形的超级攻略
2016/03/21 HTML / CSS
伦敦所有西区剧院演出官方票务代理:Theatre Tickets Direct
2017/05/26 全球购物
英国知名小木屋定制网站:Tiger Sheds
2020/03/06 全球购物
什么是封装
2013/03/26 面试题
写演讲稿所需要注意的4个条件
2014/01/09 职场文书
工程质量月活动方案
2014/02/19 职场文书
安卓程序员求职信
2014/02/28 职场文书
纪委立案决定书
2015/06/24 职场文书
简爱读书笔记
2015/06/26 职场文书
MySQL创建索引需要了解的
2021/04/08 MySQL
关于JavaScript 中 if包含逗号表达式
2021/11/27 Javascript