jQuery实现磁力图片跟随效果完整示例


Posted in Javascript onSeptember 16, 2016

本文实例演示了jQuery实现磁力图片跟随效果。分享给大家供大家参考,具体如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>磁力图片</title>
  <style type="text/css">
    #imgSel{position:absolute;}
  </style>
  <script src="../js/jquery-1.5.1.min.js" type="text/javascript"></script>
  <script type="text/javascript">
    $(function () {
      $(document).mousemove(function (e) {
        $("#imgSel").animate({"left":e.pageX,"top":e.pageY},0.1);
      });
    });
  </script>
</head>
<body>
  <img id="imgSel" src="../images/select.JPG" />
</body>
</html>

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
PJ Blog修改-禁止复制的代码和方法
Oct 25 Javascript
JS中令人发指的valueOf方法介绍
Feb 22 Javascript
IE下window.onresize 多次调用与死循环bug处理方法介绍
Nov 12 Javascript
jquery.ui.draggable中文文档(原文翻译)
Nov 15 Javascript
深入理解JavaScript高级之词法作用域和作用域链
Dec 10 Javascript
jQuery页面加载初始化常用的三种方法
Jun 04 Javascript
javascript中的throttle和debounce浅析
Jun 06 Javascript
KnockoutJS 3.X API 第四章之表单value绑定
Oct 10 Javascript
Angular2学习教程之组件中的DOM操作详解
May 28 Javascript
详解Vue的常用指令v-if, v-for, v-show,v-else, v-bind, v-on
Oct 12 Javascript
微信小程序中转义字符的处理方法
Mar 28 Javascript
vue-router之解决addRoutes使用遇到的坑
Jul 19 Javascript
jQuery使用animate实现ul列表项相互飘动效果示例
Sep 16 #Javascript
jQuery中fadein与fadeout方法用法示例
Sep 16 #Javascript
jQuery中slidedown与slideup方法用法示例
Sep 16 #Javascript
jQuery中show与hide方法用法示例
Sep 16 #Javascript
Javascript中函数名.length属性用法分析(对比arguments.length)
Sep 16 #Javascript
Javascript函数中的arguments.callee用法实例分析
Sep 16 #Javascript
AngularJs 动态加载模块和依赖
Sep 15 #Javascript
You might like
PHP header函数分析详解
2011/08/06 PHP
PHP中多维数组的foreach遍历示例
2014/06/13 PHP
php数组实现根据某个键值将相同键值合并生成新二维数组的方法
2017/04/26 PHP
PHP5中使用mysqli的prepare操作数据库的介绍
2019/03/18 PHP
window.onload 加载完毕的问题及解决方案(上)
2009/07/09 Javascript
Javascript的构造函数和constructor属性
2010/01/09 Javascript
突发奇想的一个jquery插件
2010/11/19 Javascript
js将控件隐藏及display属性的使用介绍
2013/12/30 Javascript
节点的插入之append()和appendTo()的用法介绍
2014/01/13 Javascript
js中把JSON字符串转换成JSON对象最好的方法
2014/03/21 Javascript
JavaScript中字符串分割函数split用法实例
2015/04/07 Javascript
jQuery右侧选项卡焦点图片轮播特效代码分享
2015/09/05 Javascript
深入理解bootstrap框架之第二章整体架构
2016/10/09 Javascript
JS 拦截全局ajax请求实例解析
2016/11/29 Javascript
微信小程序canvas开发水果老虎机的思路详解
2020/02/07 Javascript
[04:48]DOTA2亚洲邀请赛林书豪为VGJ加油
2017/04/01 DOTA
[02:12]2019完美世界全国高校联赛(春季赛)报名开启
2019/03/01 DOTA
[01:06:19]DOTA2-DPC中国联赛定级赛 LBZS vs SAG BO3第二场 1月8日
2021/03/11 DOTA
Python正则表达式教程之三:贪婪/非贪婪特性
2017/03/02 Python
python 发送和接收ActiveMQ消息的实例
2019/01/30 Python
解决python super()调用多重继承函数的问题
2019/06/26 Python
django 连接数据库 sqlite的例子
2019/08/14 Python
Python 使用type来定义类的实现
2019/11/19 Python
python 两种方法删除空文件夹
2020/09/29 Python
HTML5网页录音和上传到服务器支持PC、Android,支持IOS微信功能
2019/04/26 HTML / CSS
html5构建触屏网站之touch事件介绍
2013/01/07 HTML / CSS
纽约著名的服装辅料来源:M&J Trimming
2017/07/26 全球购物
The North Face北面美国官网:美国著名户外品牌
2018/09/15 全球购物
华为菲律宾官方网站:HUAWEI Philippines
2021/02/23 全球购物
团员的自我评价
2013/12/01 职场文书
课程设计的心得体会
2014/09/03 职场文书
交心谈心活动总结
2015/05/11 职场文书
业务员年终工作总结2015
2015/05/28 职场文书
考研经验交流会策划书
2015/11/02 职场文书
react antd实现动态增减表单
2021/06/03 Javascript
动画电影《龙珠超 超级英雄》延期上映
2022/03/20 日漫