jQuery实现的鼠标滑过切换图片代码实例
有时候网页需要这样的简单效果，那就是当鼠标滑过默认图片的时候，能够实现图片的切换，可能在实际应用中，往往没有这么简单，不过大家可以自行扩展一下，下面简单介绍一下次效果。
html静态代码如下:
<body>
<img src="data:images/mayi.jpg" />
</body>jquery切换代码:
$(document).ready(function(){
var newImage=new Image();
var oldImage=$('img').attr('src');
newImage.src='images/new.jpg';
$('img').hover(function(){
$('img').attr('src',newImage.src);
},
function(){
$('img').attr('src',oldImage);
})
})
jQuery实现的鼠标滑过切换图片代码实例的更多相关文章
- CSS控制当鼠标滑过时更换图片的效果
鼠标滑过时更换图片的效果有很多方法可以实现,在本文将为大家介绍喜爱如何通过css来实现.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tra ...
- 基于jQuery左右滑动切换图片代码
分享一款基于jQuery左右滑动切换图片代码.这是一款基于jQuery实现的左右滑动切换焦点图代码.效果图如下: 在线预览 源码下载 实现的代码: <div class="v_ou ...
- jQuery hover事件鼠标滑过图片半透明标题文字滑动显示隐藏
1.效果及功能说明 hover事件制作产品图片鼠标滑过图片半透明,标题文字从左到右滑动动画移动显示隐藏 2.实现原理 首先把效果都隐藏,然后定义一个伪类来触发所有的效果,接下来当触发伪类后会有一个遍历 ...
- jQuery演示10种不同的切换图片列表动画效果以及tab动画演示 2
很常用的一款特效纯CSS完成tab实现5种不同切换对应内容效果 实例预览 下载地址 实例代码 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 ...
- jQuery演示10种不同的切换图片列表动画效果
经常用到的图片插件演示jQuery十种不同的切换图片列表动画效果 在线演示 下载地址 实例代码 <!DOCTYPE html> <html lang="en" c ...
- jquery鼠标滑过展示图片时显示详情
jquery: <script src="js/jquery.js" type="text/javascript"></script> ...
- jQuery实际案例①——淘宝精品广告(鼠标触碰切换图片、自动轮播图片)
遇到的问题:自动轮播的实现,实质与轮播图一样儿一样儿的,不要被不同的外表所欺骗,具体的js代码如下:
- onmouseover和onmouseout鼠标移入移出切换图片的几种实现方法
鼠标移入移出图片切换很常见的,那我们就来说说他的写法 第一种方法,也是最简单的一种,在html:里就可实现 <img class="img" src="img/do ...
- 鼠标滑过切换div显示（鼠标事件）
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
随机推荐
- C语言 文件读取
FILE *fp = fopen("data.txt","rt");fscanf(fp,"%d", &n ); /* 把数据放到数组 ...
- Ubuntu 安装和配置redis数据库
Ubuntu 14.04下安装和配置redis数据库 小编现在在写一个分布式爬虫,要用到这个数据库,所以分享一下小编是如何安装和配置的,希望对大家有帮助. 工具/原料 Ubuntu 系统电脑一台 ...
- 【转】POP3、SMTP和IMAP之间的区别和联系
POP3 POP3是Post Office Protocol 3的简称,即邮局协议的第3个版本,它规定怎样将个人计算机连接到Internet的邮件服务器和下载电子邮件的电子协议.它是因特网电子邮件的第 ...
- intellij idea +maven4+springmvc4搭建
0.淘宝mave培训PPT http://www.open-open.com/doc/view/4058453cde4b429c82ff2807d8aa81f0 1.intellij创建空的maven ...
- ASP.NET MVC 中的ViewData与ViewBag
在Asp.net MVC 3 web应用程序中,我们会用到ViewData与ViewBag,对比一下: ViewData ViewBag 它是Key/Value字典集合 它是dynamic类型对像 从 ...
- char与varchar区别-转
1．CHAR的长度是固定的,而VARCHAR2的长度是可以变化的, 比如,存储字符串“abc",对于CHAR (10),表示你存储的字符将占10个字节(包括7个空字符),而同样的VARCHA ...
- hadoop(四):配置参数
hadoop参数配置,主要是配置 core-site.xml,hdfs-site.xml,mapred-site.xml 三个配置文件,core-site.xml是全局配置,hdfs-site.xml ...
- mootools里选择器$,$$,$E,$ES等的区别
区别就是 $和$$都是1个参数, $适用于ID,或者ID代表的对象 $$适用于CSS选择器 $E和$ES,有2个参数,第二个参数是可选参数代表(filter,即某个ID范围里的元素) $E('inpu ...
- MSCRM Plugin Debug
MS CRM 2011的自定义和开发(11)——插件(plugin)开发(四) 上面几篇文章介绍了Microsoft Dynamics CRM 2011中如何进行插件开发,本文将介绍插件的调试. 调试 ...
- winform 承载 WCF 注意，可能不是工作在多线程模式下
[ServiceBehavior(ConcurrencyMode = ConcurrencyMode.Multiple, InstanceContextMode = InstanceContextMo ...