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 相关文章推荐
根据对象的某一属性进行排序的js代码(如:name,age)
Aug 10 Javascript
jquery获取tr中控件值并操作tr实现思路
Mar 27 Javascript
js 金额格式化来回转换示例
Feb 23 Javascript
jQuery使用addClass()方法给元素添加多个class样式
Mar 26 Javascript
JavaScript DOM操作表格及样式
Apr 13 Javascript
jquery中map函数遍历数组用法实例
May 18 Javascript
js跨域请求的5中解决方式
Jul 02 Javascript
PHP结合jQuery实现红蓝投票功能特效
Jul 22 Javascript
JS代码实现百度地图 画圆 删除标注
Oct 12 Javascript
Bootstrap导航菜单点击后无法自动添加active的处理方法
Aug 10 Javascript
vue slots 组件的组合/分发实例
Sep 06 Javascript
了解JavaScript中let语句
May 30 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实现的下载远程图片自定义函数分享
2015/01/28 PHP
php数组随机排序实现方法
2015/06/13 PHP
PHP格式化MYSQL返回float类型的方法
2016/03/30 PHP
初学Jquery插件制作 在SageCRM的查询屏幕隐藏部分行的功能
2011/12/26 Javascript
javascript 快速排序函数代码
2012/05/30 Javascript
jquery和javascript中如何将一元素的内容赋给另一元素
2014/01/09 Javascript
js 动态修改css文件的方法
2014/08/05 Javascript
javascript中in运算符用法分析
2015/04/28 Javascript
js日期插件dateHelp获取本月、三个月、今年的日期
2016/03/07 Javascript
浅谈js中用$(#ID)来作为选择器的问题(id重复的时候)
2017/02/14 Javascript
js实现canvas图片与img图片的相互转换的示例
2017/08/31 Javascript
vue element项目引入icon图标的方法
2018/06/06 Javascript
使用validate.js实现表单数据提交前的验证方法
2018/09/04 Javascript
解决vue attr取不到属性值的问题
2018/09/18 Javascript
vue 自定义组件的写法与用法详解
2020/03/04 Javascript
js 闭包深入理解与实例分析
2020/03/19 Javascript
ant design vue datepicker日期选择器中文化操作
2020/10/28 Javascript
python清除字符串里非数字字符的方法
2015/07/02 Python
Python面向对象程序设计之私有属性及私有方法示例
2019/04/08 Python
Python基础知识点 初识Python.md
2019/05/14 Python
Python MySQLdb 执行sql语句时的参数传递方式
2020/03/04 Python
Python通过kerberos安全认证操作kafka方式
2020/06/06 Python
keras导入weights方式
2020/06/12 Python
Python eval函数原理及用法解析
2020/11/14 Python
常用的四种CSS透明属性介绍
2014/04/12 HTML / CSS
HTML5 Canvas中绘制矩形实例
2015/01/01 HTML / CSS
Charles & Keith欧盟:新加坡时尚品牌
2019/08/01 全球购物
员工自我鉴定范文
2013/10/06 职场文书
毕业生自我推荐
2013/11/04 职场文书
优秀导游先进事迹材料
2014/01/25 职场文书
同事打架检讨书
2014/02/04 职场文书
检察院起诉意见书
2015/05/20 职场文书
2015年美容师个人工作总结
2015/10/14 职场文书
Go语言操作数据库及其常规操作的示例代码
2021/04/21 Golang
Java8中Stream的一些神操作
2021/11/02 Java/Android
部分武汉产收音机展览
2022/04/07 无线电