一个简单的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 相关文章推荐
javascript中关于执行环境的杂谈
Aug 14 Javascript
javascript学习笔记(十六) 系统对话框(alert、confirm、prompt)
Jun 20 Javascript
JavaScript中的正则表达式简明总结
Apr 04 Javascript
JavaScript原生对象之Number对象的属性和方法详解
Mar 13 Javascript
js鼠标点击图片切换效果代码分享
Aug 26 Javascript
JavaScript编程中实现对象封装特性的实例讲解
Jun 24 Javascript
老生常谈原生JS执行环境与作用域
Nov 22 Javascript
JavaScript字符串对象
Jan 14 Javascript
jQuery实现动态删除LI的方法
May 30 jQuery
JS设计模式之惰性模式(二)
Sep 29 Javascript
vue init webpack myproject构建项目 ip不能访问的解决方法
Mar 20 Javascript
微信小程序实现传递多个参数与事件处理
Aug 12 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
php木马攻击防御之道
2008/03/24 PHP
PHP 读取和编写 XML
2014/11/19 PHP
php从memcache读取数据再批量写入mysql的方法
2014/12/29 PHP
php通过ksort()函数给关联数组按照键排序的方法
2015/03/18 PHP
多广告投放代码 推荐
2006/11/13 Javascript
在你的网页中嵌入外部网页的方法
2007/04/02 Javascript
Confirmer JQuery确认对话框组件
2010/06/09 Javascript
JQUBAR1.1 jQuery 柱状图插件发布
2010/11/28 Javascript
详解强大的jQuery选择器之基本选择器、层次选择器
2012/02/07 Javascript
非常好用的JsonToString 方法 简单实例
2013/07/18 Javascript
JavaScript中的对象序列化介绍
2014/12/30 Javascript
纯jquery实现模仿淘宝购物车结算
2015/08/20 Javascript
AngularJS控制器controller正确的通信的方法
2016/01/25 Javascript
JavaScript希尔排序、快速排序、归并排序算法
2016/05/08 Javascript
javascript表单事件处理方法详解
2016/05/15 Javascript
jQuery购物网页经典制作案例
2016/08/19 Javascript
node.js express安装及示例网站搭建方法(分享)
2016/08/22 Javascript
jQuery实现侧浮窗与中浮窗切换效果的方法
2016/09/05 Javascript
Bootstrap中data-target 到底是什么
2017/02/14 Javascript
jQuery实现滚动效果
2017/11/17 jQuery
基于dataset的使用和图片延时加载的实现方法
2017/12/11 Javascript
swiper移动端轮播插件(触碰图片之后停止轮播)
2017/12/28 Javascript
jQuery中将json数据显示到页面表格的方法
2018/05/27 jQuery
Element图表初始大小及窗口自适应实现
2020/07/10 Javascript
python实现根据主机名字获得所有ip地址的方法
2015/06/28 Python
Python 中 list 的各项操作技巧
2017/04/13 Python
Python使用re模块正则提取字符串中括号内的内容示例
2018/06/01 Python
Python使用cx_Freeze库生成msi格式安装文件的方法
2018/07/10 Python
Python基于OpenCV库Adaboost实现人脸识别功能详解
2018/08/25 Python
python 成功引入包但无法正常调用的解决
2020/03/09 Python
python查询MySQL将数据写入Excel
2020/10/29 Python
python实现定时发送邮件
2020/12/23 Python
城市规划毕业生求职信
2013/10/10 职场文书
运动会广播稿60字
2014/01/15 职场文书
怎样写辞职信
2015/02/27 职场文书
MySQL Threads_running飙升与慢查询的相关问题解决
2021/05/08 MySQL