废话不多说,直接上代码,有注释:

 <head>

     <title></title>

     <style type="text/css">

         span

         {

             position: absolute;/*给span才去绝对定位*/

         }

     </style>

     <script src="js/jquery-1.9.0.js" type="text/javascript"></script>

     <script type="text/javascript">

         $(function () {

             //为什么给document加鼠标移动事件而不是body呢,因为body相当于一div,是块级元素,他的大小根据内容的多少而定

             $(document).mousemove(function (e) {//给鼠标添加移动事件

                 //e.pageX 和 e.pageY就是获取鼠标的坐标,分别设置给span的left和top

                 $("#span1").css({ left: e.pageX, top: e.pageY });

             });

         });

     </script>

 </head>

 <body>

     <span id="span1">鼠标在这呢~~~</span>

 </body>

没什么特效,仅仅是跟着移动而已

js跟着鼠标移动的文字的更多相关文章

  1. js获取鼠标选中的文字

    1.获取选中的文字: document.selection.createRange().text; IE9以下使用 window.getSelection().toString(); 其他浏览器使用 ...

  2. js：鼠标移动到文字显示div，移出文字div显示，鼠标能移进div

    <!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" ...

  3. j-query应用---鼠标悬停不同文字显示不同背景图片banner动画

    源代码部分:注意事项:样式表的引用的路径要一致. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ...

  4. JS随鼠标坐标移动，显示浮动层内容

    在表单等项目中往往会遇到类似于“备注”.“说明”等100个字内的内容需要显示. 这些内容如果全部呈现开,会影响布局和美观,确又没有必要设计一个层或是一个页面. 那么,我们可以把这些内容放到浮动层中,鼠 ...

  5. JS Event 鼠标拖拽事件

    <!DOCTYPE html><html> <head>        <meta charset="UTF-8">         ...

  6. JS---案例：图标跟着鼠标飞(有bug)

    案例:图标跟着鼠标飞(有bug) <!DOCTYPE html> <html lang="en"> <head> <meta charse ...

  7. JS---案例：图片跟着鼠标飞的最终版本

    案例:图片跟着鼠标飞的最终版本 换了个好看的糖果照片,想给博客首页加上,但是加上后,应该是overwrite原来的html,所以光有鼠标跟着飞的效果,原来的功能都不能用了 放入common.js &l ...

  8. 修改js confirm alert 提示框文字的简单实例

    修改js confirm alert 提示框文字的简单实例: <!DOCTYPE html> <html> <head lang="en"> & ...

  9. 原生js获取鼠标坐标方法全面讲解-zmq

    原生js获取鼠标坐标方法全面讲解:clientX/Y,pageX/Y,offsetX/Y,layerX/Y,screenX/Y 一.关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种:eve ...

随机推荐

  1. C#正则表达式Regex类

    C#正则表达式Regex类的使用 C#中为正则表达式的使用提供了非常强大的功能,这就是Regex类.这个包包含于System.Text.RegularExpressions命名空间下面,而这个命名空间 ...

  2. hibernate简介（Session，几种状态，方法······等）

    1.Hibernate是什么?          Hibernate是一个开放源代码的对象关系映射框架,它对JDBC进行了非常轻量级的对象封装,使得Java程序员可以随心所欲的使用对象编程思维来操纵数 ...

  3. 对jQuery.isArray方法的分析

    jQuery.isArray方法应于判断是不是数组,是的话返回true,否则返回false.调用如:jQuery.isArray([]),返回true.其实现源码如下: isArray: Array. ...

  4. Samza文档翻译 : Architecture

    http://samza.incubator.apache.org/learn/documentation/0.7.0/introduction/architecture.html Samza由三层组 ...

  5. Spring MVC Checkbox And Checkboxes Example

    In Spring MVC, <form:checkbox /> is used to render a HTML checkbox field, the checkbox values ...

  6. printf在终端输出时改变颜色

    在调试程序时,有时候要输出大量数据,如果让printf/fprintf改变输出数据的颜色,那观察数据就方便多了. 终端的字符颜色是用转义序列控制的,是文本模式下的系统显示功能,和具体的语言无关.转义序 ...

  7. ****php redis 的使用方法

    phpredis是php的一个扩展,效率是相当高有链表排序功能,对创建内存级的模块业务关系很有用;以下是redis官方提供的命令使用技巧:下载地址如下:https://github.com/owlie ...

  8. http://jingyan.baidu.com/article/a3761b2b66fe141577f9aa51.html

    http://jingyan.baidu.com/article/a3761b2b66fe141577f9aa51.html

  9. 初识MyBatis

    ORM:对象关系映射,它只是一种规则. 像MyBatis,Hibernate对jdbc进行了封装. 第一章 回顾JDBC开发 1.优点:简单易学,上手快,非常灵活构建SQL(自己写的),效率高.2.缺 ...

  10. latex 写作

    一.下载:http://www.ctex.org/CTeXDownload 二.bst文件的作用 在tex文件调用bib时,如 \bibliographystyle{Science} \bibliog ...