JS使用oumousemove和oumouseout动态改变图片显示的方法


Posted in Javascript onMarch 31, 2015

本文实例讲述了JS使用oumousemove和oumouseout动态改变图片显示的方法。分享给大家供大家参考。具体如下:

鼠标放到图片上时图片会自动变大,鼠标离开图片还原

<!DOCTYPE html>
<html>
<head>
<script>
function bigImg(x)
{
x.style.height="64px";
x.style.width="64px";
}
function normalImg(x)
{
x.style.height="32px";
x.style.width="32px";
}
</script>
</head>
<body>
<img onmouseover="bigImg(this)" onmouseout="normalImg(this)"
border="0" src="smiley.gif" alt="Smiley" width="32" height="32">
<p>The function bigImg() is triggered when the user moves
the mouse pointer over the image.</p>
<p>The function normalImg() is triggered when the mouse
pointer is moved out of the image.</p>
</body>
</html>

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

Javascript 相关文章推荐
19个很有用的 JavaScript库推荐
Jun 27 Javascript
Lazy Load 延迟加载图片的jQuery插件中文使用文档
Oct 18 Javascript
JavaScript中使用ActiveXObject操作本地文件夹的方法
Mar 28 Javascript
jQuery实现带有动画效果的回到顶部和底部代码
Nov 04 Javascript
快速学习jQuery插件 jquery.validate.js表单验证插件使用方法
Dec 01 Javascript
Ajax 加载数据 练习代码
Jan 05 Javascript
js实现手机拍照上传功能
Jan 17 Javascript
通过jsonp获取json数据实现AJAX跨域请求
Jan 22 Javascript
vue-cli3+ts+webpack实现多入口多出口功能
May 30 Javascript
layui 富文本编辑器和textarea值的相互传递方法
Sep 18 Javascript
Vue数据双向绑定原理实例解析
May 15 Javascript
vue集成一个支持图片缩放拖拽的富文本编辑器
Jan 29 Vue.js
js使用onmousemove和onmouseout获取鼠标坐标的方法
Mar 31 #Javascript
JS显示下拉列表框内全部元素的方法
Mar 31 #Javascript
JS动态改变表格边框宽度的方法
Mar 31 #Javascript
60行js代码实现俄罗斯方块
Mar 31 #Javascript
JS动态修改表格cellPadding和cellSpacing的方法
Mar 31 #Javascript
js实现的牛顿摆效果
Mar 31 #Javascript
JS动态显示表格上下frame的方法
Mar 31 #Javascript
You might like
IIS6的PHP最佳配置方法
2007/03/19 PHP
用php守护另一个php进程的例子
2015/02/13 PHP
PHP基于openssl实现的非对称加密操作示例
2019/01/11 PHP
javascript 当前日期加(天、周、月、年)
2009/08/09 Javascript
jQuery 使用手册(二)
2009/09/23 Javascript
Javascript 复制数组实现代码
2009/11/26 Javascript
JS实现队列与堆栈的方法
2016/04/21 Javascript
深入理解Ajax的get和post请求
2016/06/02 Javascript
JS匿名函数实例分析
2016/11/26 Javascript
QRCode.js:基于JQuery的生成二维码JS库的使用
2017/06/23 jQuery
微信小程序实现验证码获取倒计时效果
2018/02/08 Javascript
[10:05]DOTA2-DPC中国联赛 正赛 iG vs PSG.LGD 选手采访
2021/03/11 DOTA
python比较两个列表大小的方法
2015/07/11 Python
Django基础之Model操作步骤(介绍)
2017/05/27 Python
Python+树莓派+YOLO打造一款人工智能照相机
2018/01/02 Python
python jieba分词并统计词频后输出结果到Excel和txt文档方法
2018/02/11 Python
opencv改变imshow窗口大小,窗口位置的方法
2018/04/02 Python
在PyCharm下使用 ipython 交互式编程的方法
2019/01/17 Python
python各类经纬度转换的实例代码
2019/08/08 Python
python切片(获取一个子列表(数组))详解
2019/08/09 Python
Python pandas自定义函数的使用方法示例
2019/11/20 Python
django框架forms组件用法实例详解
2019/12/10 Python
学习Python需要哪些工具
2020/09/04 Python
使用纯HTML5编写一款网页上的时钟的代码分享
2015/11/16 HTML / CSS
大学生毕业求职的自我评价
2013/09/29 职场文书
中学生期末评语
2014/02/03 职场文书
2014年中班元旦活动方案
2014/02/14 职场文书
开学典礼决心书
2014/03/11 职场文书
政风行风评议工作总结
2014/10/21 职场文书
反邪教警示教育活动总结
2015/05/09 职场文书
2015秋季新学期开学寄语
2015/05/28 职场文书
祝酒词范文
2015/08/12 职场文书
护士心得体会范文
2016/01/25 职场文书
2019年第四季度财务部门工作计划
2019/11/02 职场文书
SQL实现LeetCode(176.第二高薪水)
2021/08/04 MySQL
关于ObjectUtils.isEmpty() 和 null 的区别
2022/02/28 Java/Android