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 相关文章推荐
判断多个元素(RADIO,CHECKBOX等)是否被选择的原理说明
Feb 18 Javascript
juqery 学习之三 选择器 简单 内容
Nov 25 Javascript
JavaScript自定义数组排序方法
Feb 12 Javascript
JS+CSS实现可拖拽的漂亮圆角特效弹出层完整实例
Feb 13 Javascript
jquery.serialize() 函数语法及简单实例
Jul 08 Javascript
vue生成随机验证码的示例代码
Sep 29 Javascript
jQuery滚动条美化插件nicescroll简单用法示例
Apr 18 jQuery
ES6知识点整理之函数对象参数默认值及其解构应用示例
Apr 17 Javascript
Javascript Worker子线程代码实例
Feb 20 Javascript
javaScript实现一个队列的方法
Jul 14 Javascript
ES6 十大特性简介
Dec 09 Javascript
用JS实现飞机大战小游戏
Jun 09 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 检查扩展库或函数是否可用的代码
2010/04/06 PHP
PHP开发微信支付的代码分享
2014/05/25 PHP
PHP自动重命名文件实现方法
2014/11/04 PHP
php递归函数三种实现方法及如何实现数字累加
2015/08/07 PHP
PHP内存溢出优化代码详解
2021/02/26 PHP
怎么让脚本或里面的函数在所有图片都载入完毕的时候执行
2006/10/17 Javascript
检测jQuery.js是否已加载的判断代码
2011/05/20 Javascript
js获取时间(本周、本季度、本月..)
2013/11/22 Javascript
Jquery结合HTML5实现文件上传
2015/06/25 Javascript
跟我学习javascript的prototype,getPrototypeOf和__proto__
2015/11/17 Javascript
KnockoutJS 3.X API 第四章之事件event绑定
2016/10/10 Javascript
JavaScript之iterable_动力节点Java学院整理
2017/06/29 Javascript
简单谈谈js的数据类型
2017/09/25 Javascript
2种简单的js倒计时方式
2017/10/20 Javascript
JavaScript判断变量名是否存在数组中的实例
2017/12/28 Javascript
使用 Vue 绑定单个或多个 Class 名的实例代码
2018/01/08 Javascript
用npm-run实现自动化任务的方法示例
2019/01/14 Javascript
如何对react hooks进行单元测试的方法
2019/08/14 Javascript
Python是编译运行的验证方法
2015/01/30 Python
在Django中使用Sitemap的方法讲解
2015/07/22 Python
Python连接SQLServer2000的方法详解
2017/04/19 Python
Python实现XML文件解析的示例代码
2018/02/05 Python
python实现txt文件格式转换为arff格式
2018/05/31 Python
python requests爬取高德地图数据的实例
2018/11/10 Python
Numpy截取指定范围内的数据方法
2018/11/14 Python
Python爬虫 批量爬取下载抖音视频代码实例
2019/08/16 Python
PyTorch 解决Dataset和Dataloader遇到的问题
2020/01/08 Python
Keras模型转成tensorflow的.pb操作
2020/07/06 Python
python3 循环读取excel文件并写入json操作
2020/07/14 Python
Python如何将将模块分割成多个文件
2020/08/04 Python
印度购买眼镜和太阳镜网站:Coolwinks
2018/09/26 全球购物
中层干部竞争上岗演讲稿
2014/01/13 职场文书
淘宝客服工作职责
2014/07/11 职场文书
人事专员岗位职责说明书
2014/07/30 职场文书
全国法制宣传日活动总结2014
2014/11/01 职场文书
2015年学生会个人工作总结
2015/04/09 职场文书