61,112
社区成员
发帖
与我相关
我的任务
分享高难度～～给多边形热点加边框颜色
下面是用多边形热点工具给图片加的热区，我想鼠标经过时显示这个热区的边框
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>test</title>
</head>
<body>
<img src="http://www.baidu.com/img/baidu_logo.gif" border="0" usemap="#Map" style="margin:0"/>
<map name="Map" id="Map">
<area shape="poly" coords="48,80,47,53,126,27,163,53,218,54,219,82" href="#" />
</map>
</body>
</html>
...全文
请发表友善的回复…
发表回复
chokobo 2011-01-18
- 打赏
- 举报
矩形还可以模拟，多边形恐怕不行了吧
xiuyouxu 2011-01-18
- 打赏
- 举报
见过矩形的边框,貌似采用div模拟实现的,多边形的不知道
songlingxi 2011-01-18
- 打赏
- 举报
你把这个做为背景多好？
<a href="#">百度</a>
a{
border:1px solid #fff;
backgtound:url(url) no-repeat left top;
display:block;
float:left;
height:高;
text-indent:-9999px;
width:宽;
}
上面的display和float二选一就可以
a:hover{
border:1px solid #ccc;
}
如果你想要那种多变行的边框
可以把a:hover里的border换成另一张有边框的背景并把border删掉就可以了
<a href="#">百度</a>
a{
border:1px solid #fff;
backgtound:url(url) no-repeat left top;
display:block;
float:left;
height:高;
text-indent:-9999px;
width:宽;
}
上面的display和float二选一就可以
a:hover{
border:1px solid #ccc;
}
如果你想要那种多变行的边框
可以把a:hover里的border换成另一张有边框的背景并把border删掉就可以了
Acesidonu 2011-01-13
- 打赏
- 举报
用这个吧
http://plugins.jquery.com/project/maphilight
http://plugins.jquery.com/project/maphilight
KK3K2005 2011-01-13
- 打赏
- 举报
<area shape="poly" coords="48,80,47,53,126,27,163,53,218,54,219,82" onmouseover='this.focus();' href="#" />
如果不是所有浏览器兼容 那么就根据 coords来硬画直线了
如果不是所有浏览器兼容 那么就根据 coords来硬画直线了
bing475879749 2011-01-13
- 打赏
- 举报
研究了一个下午无果，特来求助
