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

 <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. Codeforces Round #346 (Div. 2) E - New Reform 无相图求环

    题目链接: 题目 E. New Reform time limit per test 1 second memory limit per test 256 megabytes inputstandar ...

  2. datagridview 右键选中行 并弹出菜单

    private void dataGridView_OLUsers_CellMouseDown(object sender, DataGridViewCellMouseEventArgs e) { i ...

  3. uva 437 hdu 1069

    dp  将石块按三个面存入队列  按底面积排序  dp就最大高度  按嵌套矩形最长路做做法 #include <iostream> #include <cstdio> #inc ...

  4. 如何使用 APM 搞定 PHP 应用的性能优化？

    APM 究竟是什么? 很多人都是第一次听说 APM 的概念,本文主要阐述如何使用 APM 的解决方案来实现 PHP 应用性能的优化.首先先介绍一下 APM (Application Performan ...

  5. Android UI-开源框架ImageLoader的完美例子

    Android开源框架ImageLoader的完美例子 2013年8月19日开源框架之Universal_Image_Loader学习 很多人都在讨论如何让图片能在异步加载更加流畅,可以显示大量图片, ...

  6. SQL Server 2012 连接到数据库引擎

    第 1 课:连接到数据库引擎 https://msdn.microsoft.com/zh-cn/library/ms345332(v=sql.110).aspx   本课将介绍主要的工具以及如何连接并 ...

  7. D3DXCOLOR 和 D3DCOLOR 和 D3DCOLORVALUE

    D3DCOLOR 是一个DWORD 型.第一个byte表示Alpha值,后面三个byte依次是r(红)g(绿)b(蓝)值.32位. 下面是一些关于D3DCOLOR 的宏: D3DCOLOR_ARGB( ...

  8. Servlet入门案例

    开发servlet有三种方法: 1.实现Servlet接口; public interface Servlet { void init(ServletConfig var1) throws Servl ...

  9. CentOS7安装mysql-server

    安装ossec时需要使用到mysql-server,直接安装报错: [root@ossec-server ~]# yum install mysql-server Loaded plugins: fa ...

  10. EPEL库安装

    EPEL是yum的一个软件源,里面包含了许多基本源里没有的软件了,但在我们在使用epel时是需要安装它才可以了.EPEL,即Extra Packages for Enterprise Linux的简称 ...