map标签结合area的应用
来源:广州中睿信息技术有限公司官网
发布时间:2012/10/21 23:25:16 编辑:editor 阅读 475
今天花了一些时间看了一些javascript的知识,遇到了map标签和area标签,这个今天第一次遇到笨人总有笨办法,呵呵,晚上回来了,赶紧百度去吧,经过一番百度,总算知道是干嘛的呢这就把搜索后整理

今天花了一些时间看了一些javascript的知识,遇到了map标签和area标签,这个今天第一次遇到

笨人总有笨办法,呵呵,晚上回来了,赶紧百度去吧,经过一番百度,总算知道是干嘛的呢

这就把搜索后整理的结果贴出来

标签作用:

图像映射 

标签介绍:

以下三个标签必须同时使用:

<img>标签:插入一张图片

主要属性:

src 图片的路径,可以是相对路径,也可以是绝对路径

alt 定义图片区域的替换文本

usermap 可引用 <map> 中的 id 或 name 属性(取决于浏览器),所以我们应同时向 <map> 添加 id 和 name 属性,并且值必须一样,只是usermap属性多一个#号

<map>标签:

主要属性:

id 为 map 标签定义唯一的名称

name 为 image-map 规定的名称

<area>标签:定义图像映射中的区域(注:图像映射指得是带有可点击区域的图像)

主要属性:

shape 规定区域的形状

 圆形(cir或circle)、多边形(poly或polygon)、矩形(rect或rectangle)

coords 规定区域的x和y坐标
  coords属性与shape属性配合使用,来规定区域的尺寸、形状和位置
  圆形:shape="circle",coords="x,y,z"
  x和y定义了圆心的位置,z是以像素为单位的圆形的半径
  多边形:shape="ploygon",coords="x1,y1,x2,y2,x3,y3..."
  每一对"x,y"都定义了多边形的一个顶点
  矩形:shape="rectangle",coords="x1,y1,x2,y2"
  第一个坐标是矩形的一个绝的顶点坐标,另一对坐标是对角的顶点坐标

  定义矩形只需要这四个值,定义矩形实际上定义带有四个顶点的多边形的一种简化方法

target规定在何处打开href属性指定的目标URL
  _blank:在新窗口中打开被链接文档
  _self:默认。在相同的框架中打开被链接文档
  _parent:在父框架集中打开被链接文档
  _top:在整个窗口打开被链接文档
  framename:在指定的框架中打开被链接文档

href 定义此区域的目标 URL

源代码:

 

map area
  

 

请注意:

1.src中添加一个图片的路径,同时对坐标点做相应的数字更改

2.href链接点击的时候为了简单我只是弹出了一个提示窗口

 

联系我们CONTACT 扫一扫
愿景:成为最专业的软件研发服务领航者
中睿信息技术有限公司 广州•深圳 Tel:020-38931912 务实 Pragmatic
广州:广州市天河区翰景路1号金星大厦18层中睿信息 Fax:020-38931912 专业 Professional
深圳:深圳市福田区车公庙有色金属大厦509~510 Tel:0755-25855012 诚信 Integrity
所有权声明:PMI, PMP, Project Management Professional, PMI-ACP, PMI-PBA和PMBOK是项目管理协会(Project Management Institute, Inc.)的注册标志。
版权所有:广州中睿信息技术有限公司 粤ICP备13082838号-2