一个简单的JS鼠标悬停特效具体方法


Posted in Javascript onJune 17, 2013

首先,需加载jquery库(略过)。

其次,将下面 Javascript代码加到页面的头部:
 

<script type='text/javascript'>    
jQuery(document).ready(function($){    
$('a').hover(function()    
{    
$(this).stop().animate({'left': '5px'}, 'fast');    
}, function() {    
$(this).stop().animate({'left': '0px'}, 'fast');    
});    
});    
</script>   
 

第三,在样式中加入:
 
a {position:relative}  

完成。

简单定义下a:hover样式,貌似更简单:
 

a:hover {   padding: 0 0 0 8px;}   
 

只是不够自然而已。
Javascript 相关文章推荐
父子窗体间传递JSON格式的数据的代码
Dec 25 Javascript
关于jQuery $.isNumeric vs. $.isNaN vs. isNaN
Apr 15 Javascript
node.js中的http.createServer方法使用说明
Dec 14 Javascript
JavaScript实现梯形乘法表的方法
Apr 25 Javascript
JQuery实现鼠标移动图片显示描述层的方法
Jun 25 Javascript
JavaScript驾驭网页-CSS与DOM
Mar 24 Javascript
AngularJS中的API(接口)简单实现
Jul 28 Javascript
JavaScript运动框架 多物体任意值运动(三)
May 17 Javascript
详解原生js实现offset方法
Jun 15 Javascript
基于Vue 2.0 监听文本框内容变化及ref的使用说明介绍
Aug 24 Javascript
axios如何利用promise无痛刷新token的实现方法
Aug 27 Javascript
JS数组降维的实现Array.prototype.concat.apply([], arr)
Apr 28 Javascript
js特效,页面下雪的小例子
Jun 17 #Javascript
js弹出窗口之弹出层的小例子
Jun 17 #Javascript
js弹出层包含flash 不能关闭隐藏的2种处理方法
Jun 17 #Javascript
JS简单的轮播的图片滚动实例
Jun 17 #Javascript
js模仿windows桌面图标排列算法具体实现(附图)
Jun 16 #Javascript
js模仿jquery的写法示例代码
Jun 16 #Javascript
$.getJSON在IE下失效的原因分析及解决方法
Jun 16 #Javascript
You might like
数据库的日期格式转换
2006/10/09 PHP
麦鸡的TAB切换功能结合了javascript和css
2007/12/17 Javascript
JavaScript 定义function的三种方式小结
2009/10/16 Javascript
JavaScript高级程序设计 客户端存储学习笔记
2011/09/10 Javascript
JS关闭窗口或JS关闭页面的几种代码分享
2013/10/25 Javascript
JQuery记住用户名和密码的具体实现
2014/04/04 Javascript
基于JQuery打造无缝滚动新闻步骤详解
2016/03/31 Javascript
JScript实现地址选择功能
2017/08/15 Javascript
Node.js console控制台简单用法分析
2019/01/04 Javascript
JavaScript canvas绘制渐变颜色的矩形
2020/02/18 Javascript
使用npm命令提示: 'npm' 不是内部或外部命令,也不是可运行的程序的处理方法
2020/05/14 Javascript
[03:30]完美盛典趣味短片 CSGO2019年度名场面
2019/12/07 DOTA
Python自动化测试工具Splinter简介和使用实例
2014/05/13 Python
Python教程之全局变量用法
2016/06/27 Python
Django原生sql也能使用Paginator分页的示例代码
2017/11/15 Python
python清理子进程机制剖析
2017/11/23 Python
浅谈python 里面的单下划线与双下划线的区别
2017/12/01 Python
Python简单实现socket信息发送与监听功能示例
2018/01/03 Python
使用python为mysql实现restful接口
2018/01/05 Python
使用Python监视指定目录下文件变更的方法
2018/10/15 Python
python selenium登录豆瓣网过程解析
2019/08/10 Python
pyinstaller打包opencv和numpy程序运行错误解决
2019/08/16 Python
Python实现爬取网页中动态加载的数据
2020/08/17 Python
英国最大的奢侈品零售网络商城:Flannels
2016/09/16 全球购物
英国奢华护肤、美容和Spa品牌:Temple Spa
2019/11/02 全球购物
线程问题:wait()方法是定义在哪个类里面
2015/07/07 面试题
JavaScript实现页面动态验证码的实现示例
2021/03/23 Javascript
个人收入证明范本
2014/01/12 职场文书
机电专业大学生职业规划书范文
2014/02/25 职场文书
新学期教师寄语
2014/04/02 职场文书
经贸专业毕业生求职信范文
2014/05/01 职场文书
设计大赛策划方案
2014/06/13 职场文书
区政府领导班子个人对照检查材料
2014/09/25 职场文书
文明倡议书
2015/01/19 职场文书
演讲稿之感恩老师(三篇范文)
2019/09/06 职场文书
详解Java实现数据结构之并查集
2021/06/23 Java/Android