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();
});
});
});

  

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

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

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

  2. 右上角鼠标滑过展开收缩动画效果js代码的演示页面

    http://files.cnblogs.com/files/tanlingdangan/top_right.rar.gz 右上角鼠标滑过展开收缩动画效果js代码的演示页面http://www.51x ...

  3. JavaScript001,鼠标点击改变文字或图片

    <h3>我的第一个Javascript</h3> <p id="demo1">1.点击按钮,改变内容!</p> <!-- 设置 ...

  4. 页面点击关闭弹出提示js代码

    代码效果为: <script> window.onbeforeunload = function() { return "您好!\n我是abc\n —————————————— ...

  5. 滚动条响应鼠标滑轮事件实现上下滚动的js代码

    <script type="text/javascript"> var scrollFunc=function(e){ e=e || window.event; if( ...

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

    https://blog.csdn.net/jmd88888888/article/details/70919378

  7. 判断点击第几个按钮JS代码的三种方法

    方法一:使用下标实现<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> < ...

  8. JS实现鼠标点击爱心&绘制多边形&每日一言功能

    本篇文章主要介绍我的个人博客 程序猿刘川枫 中页面使用的美化功能(基于JS实现): 1.鼠标点击出现不同颜色爱心特效 2.页面浮动多边形跟随鼠标移动 3.每日一言功能 1.鼠标点击出现爱心特效 经常在 ...

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

    1.问题描述: 最近百度总爱做一些破坏用户信任度的事——文库金币变券.网盘限速,吓得我赶紧想办法把存在百度云音乐中的歌曲下载到本地. http://yinyueyun.baidu.com/ 可问题是云 ...

随机推荐

  1. CG-CTF 南邮 综合题2

    个人网站 http://www.wjlshare.tk 0x00前言 主要考了三块 第一块是文件包含获取源码 第二块是通过sql绕过注入获取密码 第三块是三参数回调后门的利用 做这题的时候结合了别人的 ...

  2. 【ARM-Linux开发】【Qt开发】Qt Creator自定义编译运行步骤

    原文:http://www.linuxidc.com/Linux/2015-04/115763.htm 一直用Qt Creator开发.无它,只是因为linux下C++ IDE选择不多.同时因为我抛弃 ...

  3. python解析jSON文件

    一.jSON文件 http://baike.baidu.com/link?url=wYeeLnhpXX-Tt8AoBRSNPh2P7Z2YHyK2tdD1tbBOQMfJIpA-YNHMOg2ZN6a ...

  4. javaweb中关于转发与重定向的写法

    转发: RequestDispatcher rd = request.getRequestDispatcher("/WEB-INF/main.jsp"); rd.forward(r ...

  5. SpringBoot或者SpringMVC 临时取消配置的视图页面的前后缀

    // 重定向到新的jsp页面return "redirect:/index.jsp"; // 请求转发到新的jsp页面 return "forward:/index.js ...

  6. shell实践--简单抓取网页内容

    #!/bin/bash base_path="https://testerhome.com/"user_path="ycwdaaaa/topics?page=" ...

  7. idea 如何加入插件SonarLint

    idea 如何加入插件SonarLint   IDEA的插件安装有两种方法:一是在线安装:二是离线安装,即将插件的安装包下载以后从本地安装.   一.在线安装的过程:         1.打开IDEA ...

  8. linux下的终端利器 tmux 安装以及使用

    ref :https://www.jianshu.com/p/fd3bbdba9dc9 Introduction 为什么使用tmux? 因为如果我们用terminal连接remote server.发 ...

  9. AOP的应用与基本概念(源自别人的博文)

    什么是AOP AOP(Aspect-OrientedProgramming,面向方面编程),可以说是OOP(Object-Oriented Programing,面向对象编程)的补充和完善.OOP引入 ...

  10. MyEclipse的Server标签出现:Could not create the view: An unexpected exception was thrown

    删除工作空间下的.metadata\.plugins\org.eclipse.core.runtime\.settings\com.genuitec.eclipse.ast.deploy.core.p ...