jquery实现的元素的left增加N像素 鼠标移开会慢慢的移动到原来的位置


Posted in Javascript onMarch 21, 2010

此控件是基于Jquery开发的,要引用Jquery框架
控件代码

$.fn.myNudge = function() { 
var self = $(this); 
self.css({ position: "absolute" }); //让这个元素绝对定位 
var selfLeft = self.css("left"); 
var selfTop = self.css("top"); 
self.css({ left: selfLeft, top: selfTop }); //设置这个元素为原来的位置 
self.hover(function() { 
self.animate({ left: "+=50px" }, 1000); 
}, 
function() { 
self.animate({ left: "-=50px" }, 1000); 
} 
); 
}

使用方法
HTML代码
<span id="Span1" class="s">sadfsadfds</span><br /> 
JAVASCRIPT代码 
<script type="text/javascript"> 
$(function() { 
$("#Span1").myNudge(); 
}); 
</script>
Javascript 相关文章推荐
JS回调函数的应用简单实例
Sep 17 Javascript
js实现二代身份证号码验证详解
Nov 20 Javascript
JavaScript实现穷举排列(permutation)算法谜题解答
Dec 29 Javascript
在JavaScript中操作时间之getUTCDate()方法的使用
Jun 10 Javascript
jQuery Validation PlugIn的使用方法详解
Dec 18 Javascript
Bootstrap导航中表单简单实现代码
Mar 06 Javascript
es6+angular1.X+webpack 实现按路由功能打包项目的示例
Aug 16 Javascript
javaScript实现复选框全选反选事件详解
Nov 20 Javascript
jquery 实现拖动文件上传加载进度条功能
Mar 18 jQuery
JS实现可针对算术表达式求值的计算器功能示例
Sep 04 Javascript
vue遍历生成的输入框 绑定及修改值示例
Oct 30 Javascript
微信小程序加载机制及运行机制图解
Nov 27 Javascript
javascript qq右下角滑出窗口 sheyMsg
Mar 21 #Javascript
js 居中漂浮广告
Mar 21 #Javascript
jquery checkbox,radio是否选中的判断代码
Mar 20 #Javascript
javascript中的new使用
Mar 20 #Javascript
javascript 操作select下拉列表框的一点小经验
Mar 20 #Javascript
js 格式化时间日期函数小结
Mar 20 #Javascript
window.location.hash 属性使用说明
Mar 20 #Javascript
You might like
PHP使用PHPMailer发送邮件的简单使用方法
2013/11/12 PHP
php实现专业获取网站SEO信息类实例
2015/04/02 PHP
PHP内核探索之解释器的执行过程
2015/12/22 PHP
laravel 解决groupBy时出现的错误 isn't in Group By问题
2019/10/17 PHP
JS、CSS加载中的小问题探讨
2013/11/26 Javascript
JavaScript中的this,call,apply使用及区别详解
2016/01/29 Javascript
基于JavaScript实现回到页面顶部动画代码
2016/05/24 Javascript
AngularJs $parse、$eval和$observe、$watch详解
2016/09/21 Javascript
Bootstrap组合上、下拉框简单实现代码
2017/03/06 Javascript
JavaScript实现设置默认日期范围为最近40天的方法分析
2017/07/12 Javascript
JS如何实现在页面上快速定位(锚点跳转问题)
2017/08/14 Javascript
详解Vue开发微信H5微信分享签名失败问题解决方案
2018/08/09 Javascript
详解webpack4.x之搭建前端开发环境
2019/03/28 Javascript
Jquery让form表单异步提交代码实现
2019/11/14 jQuery
vue通过v-html指令渲染的富文本无法修改样式的解决方案
2020/05/20 Javascript
[02:10]2018DOTA2亚洲邀请赛赛前采访-Liquid
2018/04/03 DOTA
python操作摄像头截图实现远程监控的例子
2014/03/25 Python
Python RuntimeError: thread.__init__() not called解决方法
2015/04/28 Python
python 禁止函数修改列表的实现方法
2017/08/03 Python
Django使用httpresponse返回用户头像实例代码
2018/01/26 Python
python 借助numpy保存数据为csv格式的实现方法
2018/07/04 Python
python读取word文档,插入mysql数据库的示例代码
2018/11/07 Python
python实现停车管理系统
2018/11/30 Python
django框架使用views.py的函数对表进行增删改查内容操作详解【models.py中表的创建、views.py中函数的使用,基于对象的跨表查询】
2019/12/12 Python
python变量的作用域是什么
2020/05/26 Python
Python通过len函数返回对象长度
2020/10/22 Python
Python eval函数介绍及用法
2020/11/09 Python
荷兰皇家航空公司官方网站:KLM Royal Dutch Airlines
2017/12/07 全球购物
Jimmy Choo美国官网:周仰杰鞋子品牌
2018/06/08 全球购物
巴西美妆购物网站:Kutiz Beauté
2019/03/13 全球购物
本科毕业生自荐信
2014/06/02 职场文书
计算机毕业生自荐信
2014/06/12 职场文书
政风行风评议个人心得体会
2014/10/29 职场文书
运动会800米赞词
2015/07/22 职场文书
2015年清剿火患专项行动工作总结
2015/07/27 职场文书
在python中读取和写入CSV文件详情
2022/06/28 Python