前面我们谈到了漂浮磁力线/鼠标吸铁石特效你也可以实现,现在来聊聊点击鼠标出现漂浮字体("自信", "自强", "坚持"...)效果的实现,这两个小技巧的小心机都是吸引访客在页面的停留时间,感兴趣的朋友可以试试,这个特效只需要复制 JS 代码就可以。代码如下:

<script type="text/javascript">
/* 鼠标特效 */
var a_idx = 0;
jQuery(document).ready(function($) {
$("body").click(function(e) {
var a = new Array("自信", "自强", "坚持", "ytkah", "Laravel", "Wordpress", "公众号", "小程序", "ERP", "CRM", "帝国cms" ,"Python", "Magento", "Dedecms", "Linux", "CI", "Thinkphp");
      /* 可想而知,这里可以修改显示的字 */
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>

  保存之后就能看到博客中出现效果了。当然那些文字都是可以修改的,比如改成:富强、民主、文明...发挥自己的天才想象力吧!

点击鼠标出现漂浮字体("自信", "自强", "坚持"...)效果实现的更多相关文章

  1. 点击鼠标获取元素ID

    原文:点击鼠标获取元素ID public partial class Form1 : Form { public Form1() { InitializeComponent(); } private ...

  2. 原生js添加博客点击鼠标出小心心效果~~

    昨天刚申请成功JS权限,心血来潮想添加点东西,记得之前看到别人家博客首页点击鼠标的时候会出现炫酷的 “小心心”,自己也来搞一个.没有用jquery啥的框架,原生js写起来麻烦了点,不过主要是怕博客首页 ...

  3. SVN 安装后右键出现点击鼠标右键弹出错误提示:CrashHandler initialization error

    SVN 安装后右键出现点击鼠标右键弹出错误提示:CrashHandler initialization error 原因是目标文件夹中缺少SendRpt.exe文件 解决方案:找svn是好的的同事将b ...

  4. Winform 基础二 最小化 最大化 关闭 点击任务栏隐藏显示 点击鼠标左键移动窗体

    一 最大化 二 最小化 三 关闭 四 点击任务栏隐藏显示 五 点击鼠标左键移动窗体 六 阴影效果鼠标左键移动窗口 #region UI设置 最大化.最小化.关闭.鼠标移动窗口.点击任务栏切换窗口 th ...

  5. 联想E440问题:点击鼠标时,弹出“无法连接synaptics定点装置驱动程序”错误

    笔记本:Levono E440   问题描述: 在控制面板中,点击鼠标时,弹出“无法连接synaptics定点装置驱动程序”错误,如何解决? 即使在安装联想的驱动后,也没办法解决   解决步骤: 1. ...

  6. iOS Xcode 小技巧,提升理解查询能力,Command + 点击鼠标右键 Jump to Definition等

    前言: 介绍下Xcode 小技巧,以及一下快捷键,让你调试程序更加出类拔萃,安排! Command + 点击鼠标右键 Jump to Definition,可能你平时也在用,但是你明白全部的用法吗,试 ...

  7. Pycharm用鼠标滚轮控制字体大小的

    Pycharm用鼠标滚轮控制字体大小的   一.pycharm字体放大的设置 File —> setting —> Keymap —>在搜寻框中输入:increase —> I ...

  8. 点击鼠标右键弹出错误提示:CrashHandler initialization error

    电脑重装系统后,什么都没有了,重装部分必须用的软件后,不管是在桌面还是在文件夹中,当点击鼠标右键时,总是弹出错误,如下图所示: 上网找解决方法,也没有找到,但是看错误,是与SVN有关. 产生原因:To ...

  9. (转)Pycharm用鼠标滚轮控制字体大小

    转自: Pycharm用鼠标滚轮控制字体大小 - 暗黒骑士 - 博客园 https://www.cnblogs.com/fyknight/p/6937482.html ---------------- ...

随机推荐

  1. git clone 后误删除了分离出来的文件怎么恢复?

    git clone 后,会分离出项目的文件. 误删除了,可以使用以下命令恢复: #先检查一下git状态 git status #通过如下命令重新分离出文件 git checkout -f HEAD

  2. 【Manacher算法】最长子回文串

    [Manacher算法] 这个算法用来找出一个字符串中最长的回文子字符串. 如果采取暴力解最长回文子字符串问题,大概可以有两种思路:1. 遍历出所有子字符串找其中最长的回文 2. 从每个字符作为中心, ...

  3. Oracle分析函数-OLAP函数总结

    ORACLE OLAP 函数 最近这个东东用得特别多,总结了一下 .  语法: FUNCTION_NAME(,,...)    OVER() OLAP函数语法四个部分: 1.function本身 用于 ...

  4. 5.动态代理AOP实现-DynamicProxy模式

    通过动态代理模式Interceptor实现在RegUser()方法本身业务前后加上一些自己的功能,如:PreProceed和PostProceed,即不修改UserProcessor类又能增加新功能 ...

  5. Glide和Govendor安装和使用

    两个都是Go的包管理工具,二选一 Glide参考:golang 依赖管理 /etc/profile #Go export GOROOT=/home/lintong/software/go export ...

  6. websocket Tomcat JSP Demo

    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"% ...

  7. mysql安装过程mysql本地环境变量的配置

    配置环境变量 前面步骤完成后安装好MySQL,为MySQL配置环境变量.MySQL默认安装在C:\Program Files下. 1)新建MYSQL_HOME变量,并配置:C:\Program Fil ...

  8. cpu选型

    就像手机有骁龙845和麒麟980等,电脑的cpu也有intel和amd,intel有台式机cpu, 网上搜索最具性价比神u:G4560,i3-8100, intel八代,包含奔腾G5600/G5500 ...

  9. 牛客练习赛36B

    唔在cf上做过,A题也做过,神仙说D题也是原题 这个题就是dp了.然后数组滚动一下,很显然能住遇到  i 只与 i-1 有关,所以还是挺好滚的. dp[i][j][k]表示到第I 天一共工作了J天连续 ...

  10. Gym 101972

    F读错题wa了三个小时.自闭了,不然I题有可能能出的..已经想到组合数也敲完组合数板子了. A:这...**题吧,第一眼看的这个就秒了 #include<bits/stdc++.h> #d ...