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 相关文章推荐
善用事件代理,警惕闭包的性能陷阱。
Jan 20 Javascript
checkbox全选所涉及到的知识点介绍
Dec 31 Javascript
jQuery中next方法用法实例
Apr 24 Javascript
Node.js实用代码段之获取Buffer对象字节长度
Mar 17 Javascript
滚动条的监听与内容随着滚动条动态加载的实现
Feb 08 Javascript
ionic2 tabs 图标自定义实例
Mar 08 Javascript
简单实现JS上传图片预览功能
Apr 14 Javascript
纯JavaScript实现实时反馈系统时间
Oct 26 Javascript
基于JavaScript实现一个简单的Vue
Sep 26 Javascript
TypeScript基础入门教程之三重斜线指令详解
Oct 22 Javascript
jQuery+ajax实现批量删除功能完整示例
Jun 06 jQuery
js实现无缝滚动双图切换效果
Jul 09 Javascript
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
BBS(php &amp; mysql)完整版(七)
2006/10/09 PHP
Apache服务器无法使用的解决方法
2013/05/08 PHP
ThinkPHP通过AJAX返回JSON的两种实现方法
2014/12/18 PHP
php的PDO事务处理机制实例分析
2017/02/16 PHP
原生JS实现Ajax通过GET方式与PHP进行交互操作示例
2018/05/12 PHP
php反序列化长度变化尾部字符串逃逸(0CTF-2016-piapiapia)
2020/02/15 PHP
checkbox 复选框不能为空
2009/07/11 Javascript
Prototype源码浅析 String部分(一)之有关indexOf优化
2012/01/15 Javascript
js图片自动轮播代码分享(js图片轮播)
2014/05/06 Javascript
iframe里面的元素触发父窗口元素事件的jquery代码
2014/10/19 Javascript
Javascript的闭包详解
2014/12/26 Javascript
Bootstrap实现默认导航栏效果
2020/09/21 Javascript
AngularJS 支付倒计时功能实现思路
2017/06/05 Javascript
node的process以及child_process模块学习笔记
2018/03/06 Javascript
vue的传参方式汇总和router使用技巧
2018/05/22 Javascript
React+Redux实现简单的待办事项列表ToDoList
2019/09/29 Javascript
详解datagrid使用方法(重要)
2020/11/06 Javascript
python3.3教程之模拟百度登陆代码分享
2014/01/16 Python
使用wxpython实现的一个简单图片浏览器实例
2014/07/10 Python
用Python创建声明性迷你语言的教程
2015/04/13 Python
Selenium元素的常用操作方法分析
2018/08/10 Python
Pytorch之卷积层的使用详解
2019/12/31 Python
Python高并发解决方案实现过程详解
2020/07/31 Python
python更新数据库中某个字段的数据(方法详解)
2020/11/18 Python
html5 Canvas画图教程(7)—canvas里画曲线之quadraticCurveTo方法
2013/01/09 HTML / CSS
瑞典时尚服装购物网站:Miinto.se
2017/10/30 全球购物
将世界上最美丽的摄影作品转化为艺术作品:Photos.com
2017/11/28 全球购物
Gap英国官网:Gap UK
2018/07/18 全球购物
中专三年学习的个人自我评价
2013/12/12 职场文书
幼儿园教师个人反思
2014/01/30 职场文书
乳制品整治工作方案
2014/05/29 职场文书
城市创卫标语
2014/06/17 职场文书
励志演讲稿800字
2014/08/21 职场文书
古诗文之爱国名句(77句)
2019/09/24 职场文书
一文搞懂如何实现Go 超时控制
2021/03/30 Python
Python自动化测试PO模型封装过程详解
2021/06/22 Python