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 相关文章推荐
javascript中最常用的继承模式 组合继承
Aug 12 Javascript
JS获取农历日期具体实例
Nov 14 Javascript
js实现透明度渐变效果的方法
Apr 10 Javascript
js闭包实现按秒计数
Apr 23 Javascript
Bootstrap项目实战之首页内容介绍(全)
Apr 25 Javascript
通用无限极下拉菜单的实现代码
May 31 Javascript
Vue中fragment.js使用方法详解
Mar 09 Javascript
基于vue2.0动态组件及render详解
Mar 17 Javascript
详解vuex状态管理模式
Nov 01 Javascript
基于iview的router常用控制方式
May 30 Javascript
Vue组件通信中非父子组件传值知识点总结
Dec 05 Javascript
Vue数据双向绑定原理实例解析
May 15 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
数据库相关问题
2006/10/09 PHP
完美解决PHP中文乱码
2009/11/26 PHP
PHP CodeBase:将时间显示为&quot;刚刚&quot;&quot;n分钟/小时前&quot;的方法详解
2013/06/06 PHP
php计划任务之ignore_user_abort函数实现方法
2015/01/08 PHP
PHP数组的定义、初始化和数组元素的显示实现代码
2016/11/05 PHP
PHP基于Closure类创建匿名函数的方法详解
2017/08/17 PHP
thinkphp5引入公共部分header、footer的方法详解
2018/09/14 PHP
javascript学习笔记(九)javascript中的原型(prototype)及原型链的继承方式
2011/04/12 Javascript
javascript中的window.location.search方法简介
2013/09/02 Javascript
javascript 中__proto__和prototype详解
2014/11/25 Javascript
js实现使用鼠标拖拽切换图片的方法
2015/05/04 Javascript
JS动态改变浏览器标题的方法
2016/04/06 Javascript
BootStrap中
2016/12/10 Javascript
select自定义小三角样式代码(实用总结)
2017/08/18 Javascript
JS实现静态页面搜索并高亮显示功能完整示例
2017/09/19 Javascript
vue图片上传本地预览组件使用详解
2019/02/20 Javascript
vue二选一tab栏切换新做法实现
2021/01/19 Vue.js
[53:13]2014 DOTA2国际邀请赛中国区预选赛5.21 DT VS LGD-GAMING
2014/05/22 DOTA
[57:18]DOTA2上海特级锦标赛主赛事日 - 1 败者组第一轮#3VP VS VG
2016/03/03 DOTA
Python中使用Inotify监控文件实例
2015/02/14 Python
详解Python3.1版本带来的核心变化
2015/04/07 Python
python 随机森林算法及其优化详解
2019/07/11 Python
Django框架models使用group by详解
2020/03/11 Python
浅谈keras中的batch_dot,dot方法和TensorFlow的matmul
2020/06/18 Python
.img/.hdr格式转.nii格式的操作
2020/07/01 Python
Django中template for如何使用方法
2021/01/31 Python
使用HTML5和CSS3制作一个模态框的示例
2018/03/07 HTML / CSS
Html5 Canvas动画基础碰撞检测的实现
2018/12/06 HTML / CSS
墨西哥网上购物:Linio墨西哥
2016/10/20 全球购物
世界最大的海报和艺术印刷商店:AllPosters.com
2017/02/01 全球购物
中国专业的音频分享平台:喜马拉雅
2019/05/24 全球购物
实习自我评价怎么写
2013/12/02 职场文书
Python实现socket库网络通信套接字
2021/06/04 Python
在Spring-Boot中如何使用@Value注解注入集合类
2021/08/02 Java/Android
Windows 11上手初体验:任务栏和开始菜单等迎来大改
2021/11/21 数码科技
JavaScript正则表达式实现注册信息校验功能
2022/05/30 Java/Android