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 相关文章推荐
iframe如何动态创建及释放其所占内存
Sep 03 Javascript
javascript动态控制服务器控件实例
Sep 05 Javascript
EditPlus中的正则表达式 实战(2)
Dec 15 Javascript
js自定义QQ菜单效果
Jan 10 Javascript
微信小程序使用request网络请求操作实例
Dec 15 Javascript
利用node实现一个批量重命名文件的函数
Dec 21 Javascript
Vue加载json文件的方法简单示例
Jan 28 Javascript
vue+iview动态渲染表格详解
Mar 19 Javascript
如何解决日期函数new Date()浏览器兼容性问题
Sep 11 Javascript
在vue项目中利用popstate处理页面返回的操作介绍
Aug 06 Javascript
JavaScript 几种循环方式以及模块化的总结
Sep 03 Javascript
如何vue使用el-table遍历循环表头和表体数据
Apr 26 Vue.js
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生成网页快照 不用COM不用扩展.
2010/02/11 PHP
php利用单例模式实现日志处理类库
2014/02/10 PHP
php对数组排序代码分享
2014/02/24 PHP
PHP动态输出JavaScript代码实例
2015/02/12 PHP
在视频前插入广告
2006/11/20 Javascript
基于JQuery的浮动DIV显示提示信息并自动隐藏
2011/02/11 Javascript
整理8个很棒的 jQuery 倒计时插件和教程
2011/12/12 Javascript
关于jquery的多个选择器的使用示例
2013/10/18 Javascript
sogou地图API用法实例教程
2014/09/11 Javascript
轻松创建nodejs服务器(10):处理POST请求
2014/12/18 NodeJs
JS往数组中添加项性能分析
2015/02/25 Javascript
图解JavaScript中的this关键字
2020/05/28 Javascript
原生javascript实现图片无缝滚动效果
2016/02/12 Javascript
深入了解JavaScript的逻辑运算符(与、或)
2016/12/20 Javascript
在JS中如何把毫秒转换成规定的日期时间格式实例
2017/05/11 Javascript
JS实现图片预加载之无序预加载功能代码
2017/05/12 Javascript
react高阶组件经典应用之权限控制详解
2017/09/07 Javascript
使用mint-ui实现省市区三级联动效果的示例代码
2018/02/09 Javascript
Angular 组件之间的交互的示例代码
2018/03/24 Javascript
vue使用一些外部插件及样式的配置代码
2019/11/18 Javascript
vue设置全局访问接口API地址操作
2020/08/14 Javascript
[01:10]DOTA2亚洲邀请赛 征战号角响彻全场
2015/01/06 DOTA
Win7上搭建Cocos2d-x 3.1.1开发环境
2014/07/03 Python
Python函数参数类型及排序原理总结
2019/12/19 Python
python按照list中字典的某key去重的示例代码
2020/10/13 Python
HTML实现代码雨源码及效果示例
2020/02/25 HTML / CSS
小橄榄树:Le Petit Olivier
2018/04/23 全球购物
韩国美国时尚服装和美容在线全球市场:KOODING
2018/11/07 全球购物
乡镇办公室工作决心书
2014/03/11 职场文书
《搭石》教学反思
2014/04/07 职场文书
《学棋》教后反思
2014/04/14 职场文书
护士找工作求职信
2014/07/02 职场文书
资产移交协议书
2016/03/24 职场文书
十一月早安语录:把心放轻,人生就是一朵自在的云
2019/11/04 职场文书
MySQL 全文检索的使用示例
2021/06/07 MySQL
mybatis 获取无数据的字段不显示的问题
2021/07/15 Java/Android