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

 <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. iOS 沙盒路径获取,创建文件

    沙盒下主要有四个文件夹:document,caches,tmp,library document 的路径 程序运行时生成的文件,这个文件不要存比较放大的文件,比如音频,视频类,因为这里的东西会被上传 ...

  2. js常识

    btnDelAll.Attributes.Add("onclick", "<script lunguage='javascript'>return windo ...

  3. CSS的定位属性实现text-shadow属性的文本下产生阴影效果

    只要先理解text-shadow的原理,就能用定位元素进行效果的模仿. text-shadow: h-shadiv v-shadov blur color h-shadv为文本水平移动的距离,正值相对 ...

  4. hdu 1085

    额    母函数 #include <cstdio> #include <cstring> int a[3],b[3]= {1,2,5}; int c1[10001],c2[1 ...

  5. 用CodeViz绘制函数调用关系图(call graph)

    CodeViz是<Understanding The Linux Virtual Memory Manager>(at Amazon,下载地址在页尾)的作者 Mel Gorman 写的一款 ...

  6. POJ2524+并查集

    题意简单. 询问n个人的宗教关系. #include<stdio.h> ; int fa[ maxn ]; int vis[ maxn ]; void init( int n ){ ;i& ...

  7. android 使用系统照相程序照相并存储、显示在界面上

    大部分业务可以通过调用系统的相机程序来拍照. 界面如下: <?xml version="1.0" encoding="utf-8"?> <Li ...

  8. [主席树]HDOJ4417 Super Mario

    题意:n个数 m个询问  ($n.m \le 10^5$) 每个询问有l, r, k  问的是[l, r]区间内有多少个数小于等于k 用主席树做的话查询第i小的数与k比较即可 #define lson ...

  9. highcharts 根据表格转化为不同的图表

    <!doctype html> <html lang="zh"> <head> <meta http-equiv="Conten ...

  10. python string 连接test

    def strTest(): name = "" for i in range(10): name += "hello" #print name def str ...