JavaScript简单实现鼠标移动切换图片的方法


Posted in Javascript onFebruary 23, 2016

本文实例讲述了JavaScript简单实现鼠标移动切换图片的方法。分享给大家供大家参考,具体如下:

<title>JavaScript切换图片</title>
<script>
function showDaTu(src){
document.getElementById("defaultImg").src=src;
}
</script>
<img src="images/wall1.jpg" id="defaultImg">
<br><br><br>
<img src='images/wall_s1.jpg' onmouseover="showDaTu('images/wall1.jpg')">
<img src='images/wall_s2.jpg' onmouseover="showDaTu('images/wall2.jpg')">
<img src='images/wall_s3.jpg' onmouseover="showDaTu('images/wall3.jpg')">
<img src='images/wall_s4.jpg' onmouseover="showDaTu('images/wall4.jpg')">
<br>因图片较大,请等待图片加载完成……然后鼠标放小图上就会切换了。

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
javascript显示选择目录对话框的代码
Nov 10 Javascript
jQuery操作表格(table)的常用方法、技巧汇总
Apr 12 Javascript
jQuery和AngularJS的区别浅析
Jan 29 Javascript
Node.js实现Excel转JSON
Apr 24 Javascript
多个js毫秒倒计时同时进行效果
Jan 05 Javascript
vue2.0与bootstrap3实现列表分页效果
Nov 28 Javascript
解决淘宝cnpm 安装后cnpm不是内部或外部命令的问题
May 17 Javascript
vue-content-loader内容加载器的使用方法
Aug 05 Javascript
bootstrap table实现合并单元格效果
Dec 24 Javascript
详解vue 自定义marquee无缝滚动组件
Apr 09 Javascript
详解ECMAScript2019/ES10新属性
Dec 06 Javascript
es6数组之扩展运算符操作实例分析
Apr 25 Javascript
jQuery实现返回顶部功能
Feb 23 #Javascript
JavaScript添加随滚动条滚动窗体的方法
Feb 23 #Javascript
理解javascript定时器中的单线程
Feb 23 #Javascript
如何使用PHP+jQuery+MySQL实现异步加载ECharts地图数据(附源码下载)
Feb 23 #Javascript
教你如何终止JQUERY的$.AJAX请求
Feb 23 #Javascript
JQUERY的AJAX请求缓存里的数据问题处理
Feb 23 #Javascript
javascript每日必学之多态
Feb 23 #Javascript
You might like
超级简单的php+mysql留言本源码
2009/11/11 PHP
Yii2框架RESTful API 格式化响应,授权认证和速率限制三部分详解
2016/11/10 PHP
网页常用特效代码整理
2006/06/23 Javascript
js不是基础的基础
2006/12/24 Javascript
js对象关系图 方便dom操作
2012/03/18 Javascript
仿新浪微博返回顶部的jquery实现代码
2012/10/01 Javascript
jquery控制select的text/value值为选中状态
2014/06/03 Javascript
JavaScript数组前面插入元素的方法
2015/04/06 Javascript
jQuery焦点图插件SaySlide
2015/12/21 Javascript
javascript实现随机生成DIV背景色
2016/06/20 Javascript
JS遍历ul下的li点击弹出li的索引的实现方法
2016/09/19 Javascript
AngularJS入门教程之路由机制ngRoute实例分析
2016/12/13 Javascript
JavaScript实现二叉树定义、遍历及查找的方法详解
2017/12/20 Javascript
微信小程序上传图片并等比列压缩到指定大小的实例代码
2019/10/24 Javascript
js原生map实现的方法总结
2020/01/19 Javascript
Python requests发送post请求的一些疑点
2018/05/20 Python
python实现自动获取IP并发送到邮箱
2018/12/26 Python
pycharm 实现显示project 选项卡的方法
2019/01/17 Python
django使用haystack调用Elasticsearch实现索引搜索
2019/07/24 Python
浅谈cv2.imread()和keras.preprocessing中的image.load_img()区别
2020/06/12 Python
python中绕过反爬虫的方法总结
2020/11/25 Python
Python之字符串的遍历的4种方式
2020/12/08 Python
美国最大的香水连锁店官网:Perfumania
2016/08/15 全球购物
将时尚融入珠宝:Adornmonde
2019/10/17 全球购物
C++:memset ,memcpy和strcpy的根本区别
2013/04/27 面试题
静态变量和实例变量的区别
2015/07/07 面试题
超市开学活动方案
2014/03/01 职场文书
社团活动总结范文
2014/04/26 职场文书
《三亚落日》教学反思
2014/04/26 职场文书
客户经理竞聘演讲稿
2014/05/15 职场文书
新农村建设标语
2014/06/24 职场文书
社区党的群众路线教育实践活动总结材料
2014/10/31 职场文书
医院中层管理人员培训心得体会
2016/01/11 职场文书
《植物妈妈有办法》教学反思
2016/02/23 职场文书
CSS3 制作的图片滚动效果
2021/04/14 HTML / CSS
Mysql调整优化之四种分区方式以及组合分区
2022/04/13 MySQL