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 相关文章推荐
ECMAScript 基础知识
Jun 29 Javascript
js Array对象的扩展函数代码
Apr 24 Javascript
利用window.name实现windowStorage代码分享
Jan 02 Javascript
javascript类型转换使用方法
Feb 08 Javascript
JavaScript字符串删除重复字符的方法
Dec 25 Javascript
基于Javascript实现倒计时功能
Feb 22 Javascript
javascript随机抽取0-100之间不重复的10个数
Feb 25 Javascript
JavaScript中的ajax功能的概念和示例详解
Oct 17 Javascript
JavaScript实现的选择排序算法实例分析
Apr 14 Javascript
微信小程序获取微信运动步数的实例代码
Jul 20 Javascript
javascript触发模拟鼠标点击事件
Jun 26 Javascript
jQuery实现放大镜案例
Oct 19 jQuery
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新手谈谈我的学习心得
2007/02/25 PHP
PHP导出EXCEL快速开发指南--PHPEXCEL的使用详解
2013/06/03 PHP
Ubuntu12下编译安装PHP5.3开发环境
2015/03/27 PHP
PHP SFTP实现上传下载功能
2017/07/26 PHP
php7安装yar扩展的方法详解
2017/08/03 PHP
dojo 之基础篇
2007/03/24 Javascript
js querySelector和getElementById通过id获取元素的区别
2012/04/20 Javascript
动态加载js、css等文件跨iframe实现
2014/02/24 Javascript
vue项目中做编辑功能传递数据时遇到问题的解决方法
2016/12/19 Javascript
详解nodejs 文本操作模块-fs模块(三)
2016/12/22 NodeJs
Angular中ng-options下拉数据默认值的设定方法
2017/06/21 Javascript
JS动态添加元素及绑定事件造成程序重复执行解决
2017/12/07 Javascript
基于vue-cli配置lib-flexible + rem实现移动端自适应
2017/12/26 Javascript
babel之配置文件.babelrc入门详解
2018/02/22 Javascript
微信小程序实现自动定位功能
2018/10/31 Javascript
使用react render props实现倒计时的示例代码
2018/12/06 Javascript
使用pm2自动化部署node项目的方法步骤
2019/01/28 Javascript
微信公众号H5之微信分享常见错误和问题(小结)
2019/11/14 Javascript
用Nodejs实现在终端中炒股的实现
2020/10/18 NodeJs
Vant 中的Toast设置全局的延迟时间操作
2020/11/04 Javascript
python中私有函数调用方法解密
2016/04/29 Python
pandas使用apply多列生成一列数据的实例
2018/11/28 Python
解决python3.5 正常安装 却不能直接使用Tkinter包的问题
2019/02/22 Python
Django使用 Bootstrap 样式修改书籍列表过程解析
2019/08/09 Python
Python使用QQ邮箱发送邮件实例与QQ邮箱设置详解
2020/02/18 Python
python 使用while循环输出*组成的菱形实例
2020/04/12 Python
Python使用文件操作实现一个XX信息管理系统的示例
2020/07/02 Python
Python如何把字典写入到CSV文件的方法示例
2020/08/23 Python
OPPO手机官方商城:中国手机市场出货量第一品牌
2017/10/18 全球购物
德国骆驼商店:ActiveFashionWorld
2017/11/18 全球购物
Sunglass Hut巴西网上商店:男女太阳镜
2020/10/04 全球购物
怎样创建、运行java程序
2014/08/01 面试题
师范应届毕业生自荐信
2013/11/18 职场文书
庆祝三八妇女节标语
2014/10/09 职场文书
大学生个人年度总结范文
2015/02/15 职场文书
关于MybatisPlus配置双数据库驱动连接数据库问题
2022/01/22 Java/Android