7.6.2.htm
来自「一部非常好的javaScript教程」· HTM 代码 · 共 158 行
HTM
158 行
<html>
<head>
<title>Untitled Document</title>
<LINK REL ="stylesheet" TYPE = "text/css" HREF = ".../contents.css">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head>
<body bgcolor="#FFFFFF">
<h2 align="center">属性与事件</h2>
<p>1. 属性与事件列表</p>
<p>
image 对象的属性和事件如表 7.5 所示。
<p> <div align=center>表 7.5 image 对象的属性和方法</div>
<p><center>
<table BORDER cellspacing=2 cellpadding=9 width=598>
<tr>
<td width="15%" valign="TOP">
<div align="center"><b><font face="宋体,SimSun" lang="ZH-CN" size="1">项目</font></b>
</div>
</td>
<td width="85%" valign="TOP">
<div align="center"><b><font face="宋体,SimSun" lang="ZH-CN" size="1">说明</font></b>
</div>
</td>
</tr>
<tr>
<td width="15%" valign="TOP">
<div align="center"><font size="1">border</font> </div>
</td>
<td width="85%" valign="TOP"> <font size=1> </font><font face="宋体,SimSun" lang="ZH-CN" size=1>表示图像边框的宽度(以像素为单位),对应于</font><font size=1>
IMG </font><font face="宋体,SimSun" lang="ZH-CN" size=1>标记符的</font><font size=1>
BORDER </font><font face="宋体,SimSun" lang="ZH-CN" size=1>属性。</font> </td>
</tr>
<tr>
<td width="15%" valign="TOP">
<div align="center"><font size="1">complete</font> </div>
</td>
<td width="85%" valign="TOP"> <font size=1> </font><font face="宋体,SimSun" lang="ZH-CN" size=1>表示图像是否完全装入的布尔属性。如果完成装入,此属性值为</font><font size=1>
true</font><font face="宋体,SimSun" lang="ZH-CN" size=1>;如果装入失败或发生错误,此属性值为</font><font size=1>
false</font><font face="宋体,SimSun" lang="ZH-CN" size=1>。</font> </td>
</tr>
<tr>
<td width="15%" valign="TOP">
<div align="center"><font size="1">height</font> </div>
</td>
<td width="85%" valign="TOP"> <font size=1> </font><font face="宋体,SimSun" lang="ZH-CN" size=1>表示图像的高度(以像素为单位),对应于</font><font size=1>
IMG </font><font face="宋体,SimSun" lang="ZH-CN" size=1>标记符的</font><font size=1>
HEIGHT </font><font face="宋体,SimSun" lang="ZH-CN" size=1>属性。</font> </td>
</tr>
<tr>
<td width="15%" valign="TOP">
<div align="center"><font size="1">hspace</font> </div>
</td>
<td width="85%" valign="TOP"> <font size=1> </font><font face="宋体,SimSun" lang="ZH-CN" size=1>表示图像在水平方向上与其他相邻对象的距离(以像素为单位),对应于</font><font size=1>
IMG </font><font face="宋体,SimSun" lang="ZH-CN" size=1>标记符的</font><font size=1>
HSPACE </font><font face="宋体,SimSun" lang="ZH-CN" size=1>属性。</font> </td>
</tr>
<tr>
<td width="15%" valign="TOP">
<div align="center"><font size="1">lowsrc</font> </div>
</td>
<td width="85%" valign="TOP"> <font size=1> </font><font face="宋体,SimSun" lang="ZH-CN" size=1>表示用于低分辨率显示器的备用图像(通常具有较低分辨率),对应于</font><font size=1>
IMG </font><font face="宋体,SimSun" lang="ZH-CN" size=1>标记符的</font><font size=1>
LOWSRC </font><font face="宋体,SimSun" lang="ZH-CN" size=1>属性。在高分辨率显示器上装入图像时,先装入此低分辨率图像,然后用实际图像替换。</font>
</td>
</tr>
<tr>
<td width="15%" valign="TOP">
<div align="center"><font size="1">name</font> </div>
</td>
<td width="85%" valign="TOP"> <font size=1> </font><font face="宋体,SimSun" lang="ZH-CN" size=1>表示图像的名称,对应于</font><font size=1>
IMG </font><font face="宋体,SimSun" lang="ZH-CN" size=1>标记符的</font><font size=1>
NAME </font><font face="宋体,SimSun" lang="ZH-CN" size=1>属性。</font> </td>
</tr>
<tr>
<td width="15%" valign="TOP">
<div align="center"><font size="1">onAbort</font> </div>
</td>
<td width="85%" valign="TOP"> <font size=1> </font><font face="宋体,SimSun" lang="ZH-CN" size=1>图像装入中断时触发。</font>
</td>
</tr>
<tr>
<td width="15%" valign="TOP">
<div align="center"><font size="1">onError</font> </div>
</td>
<td width="85%" valign="TOP"> <font size=1> </font><font face="宋体,SimSun" lang="ZH-CN" size=1>图像装入出错时触发。</font>
</td>
</tr>
<tr>
<td width="15%" valign="TOP">
<div align="center"><font size="1">onKeyDown</font> </div>
</td>
<td width="85%" valign="TOP"> <font size=1> </font><font face="宋体,SimSun" lang="ZH-CN" size=1>在图像上按下某键时触发。</font>
</td>
</tr>
<tr>
<td width="15%" valign="TOP">
<div align="center"><font size="1">onKeyPress</font> </div>
</td>
<td width="85%" valign="TOP"> <font size=1> </font><font face="宋体,SimSun" lang="ZH-CN" size=1>在图像上按住某键时触发。</font>
</td>
</tr>
<tr>
<td width="15%" valign="TOP">
<div align="center"><font size="1">onKeyup</font> </div>
</td>
<td width="85%" valign="TOP"> <font size=1> </font><font face="宋体,SimSun" lang="ZH-CN" size=1>在图像上松开某键时触发。</font>
</td>
</tr>
<tr>
<td width="15%" valign="TOP">
<div align="center"><font size="1">onLoad</font> </div>
</td>
<td width="85%" valign="TOP"> <font size=1> </font><font face="宋体,SimSun" lang="ZH-CN" size=1>在图像装入完成时触发。</font>
</td>
</tr>
<tr>
<td width="15%" valign="TOP">
<div align="center"><font size="1">src</font> </div>
</td>
<td width="85%" valign="TOP"> <font size=1> </font><font face="宋体,SimSun" lang="ZH-CN" size=1>表示图像的</font><font size=1>
URL</font><font face="宋体,SimSun" lang="ZH-CN" size=1>,对应于</font><font size=1>
IMG </font><font face="宋体,SimSun" lang="ZH-CN" size=1>标记符的</font><font size=1>
SRC </font><font face="宋体,SimSun" lang="ZH-CN" size=1>属性。动态改变此属性时可以动态载入图像。</font>
</td>
</tr>
<tr>
<td width="15%" valign="TOP">
<div align="center"><font size="1">vspace</font> </div>
</td>
<td width="85%" valign="TOP"> <font size=1> </font><font face="宋体,SimSun" lang="ZH-CN" size=1>表示图像在垂直方向上与其他相邻对象的距离(以像素为单位),对应于</font><font size=1>
IMG </font><font face="宋体,SimSun" lang="ZH-CN" size=1>标记符的</font><font size=1>
VSPACE </font><font face="宋体,SimSun" lang="ZH-CN" size=1>属性。</font> </td>
</tr>
<tr>
<td width="15%" valign="TOP">
<div align="center"><font size="1">width</font> </div>
</td>
<td width="85%" valign="TOP"> <font size=1> </font><font face="宋体,SimSun" lang="ZH-CN" size=1>表示图像的宽度(以像素为单位),对应于</font><font size=1>
IMG </font><font face="宋体,SimSun" lang="ZH-CN" size=1>标记符的</font><font size=1>
WIDTH </font><font face="宋体,SimSun" lang="ZH-CN" size=1>属性。</font> </td>
</tr>
</table>
<p></center>
<p>
2. 示例 1<p>
本示例在网页中显示出了 image 对象的各种属性值。
<p><a href="../src/tu7.12.htm" target="_blank">示例</a>
<p>
3. 示例 2<p>
本示例通过动态改变 image 对象的 src 属性制作出常见的翻滚图效果。
<p><a href="../src/tu7.13.htm" target="_blank">示例 </a>
<p>本示例的效果为:网页上显示一幅图像,当用户将鼠标指针移动到该图像上时,图像动态切换,当鼠标指针移出图像范围时,切换回原始图像。
</body>
</html>
⌨️ 快捷键说明
复制代码Ctrl + C
搜索代码Ctrl + F
全屏模式F11
增大字号Ctrl + =
减小字号Ctrl + -
显示快捷键?