html里,如何去掉点击map里area的边框

html代码

<img src="../images/account/safe_part_1.png" width="990" height="334" usemap="#safeMap"/>
<map name="safeMap" id="safeMap">
  <area shape="rect" coords="4,191,156,233" href="http://www.cadf.org.cn/" target="_blank" />
  <area shape="rect" coords="163,191,320,233" href="http://hk.shmzj.gov.cn/" target="_blank"/>
  <area shape="rect" coords="322,191,480,233" href="http://www.yintongcard.com/ytcard/zh_CN/index.html" target="_blank"/>

  <area shape="rect" coords="4,240,156,282" href="http://cn.unionpay.com/" target="_blank"/>
  <area shape="rect" coords="163,240,320,282" href="http://www.chinaums.com/" target="_blank"/>
  <area shape="rect" coords="322,240,480,282" href="http://www.chinapay.com/" target="_blank"/>

  <area shape="rect" coords="4,291,156,333" href="http://www.cpic.com.cn/cpic/index.shtml" target="_blank"/>
  <area shape="rect" coords="164,291,321,333" href="http://www.pingan.com/index.shtml" target="_blank"/>
  <area shape="rect" coords="327,291,480,333" href="http://www.spdb.com.cn/" target="_blank"/>
</map>

效果:

问题:

当鼠标移到map的area上,鼠标点击下去时,会有一个蓝色的边框

方案:

在需要去掉边框的<area>标签中加入onfocus="blur(this);"

分析:onfocus 事件在对象获得焦点时发生,那么blur(this)则是让当前对象失去焦点。而那个鼠标按下出现的蓝色边框则是焦点线了。

注:一般为了页面美观和效果一致,要去掉这种html标签自带的效果。但是,通常情况下,尽量不要刻意去除。

若是要在每一个aera上加入,仅用js做一下处理

$(function(){

  $.each($("#safeMap area"),function(i,val){
    $(val).attr({"onfocus":"blur(this)"});

  })

})

时间: 2024-10-08 20:32:42

html里,如何去掉点击map里area的边框的相关文章

[原创]java WEB学习笔记59:Struts2学习之路---OGNL,值栈,读取对象栈中的对象的属性,读取 Context Map 里的对象的属性,调用字段和方法,数组,list,map

本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱好者,互联网技术发烧友 微博:伊直都在0221 QQ:951226918 -----------------------------------------------------------------------------------------------------------------

C++中基于Crt的内存泄漏检测(重载new和delete,记录在Map里)

尽管这个概念已经让人说滥了 ,还是想简单记录一下, 以备以后查询. #ifdef _DEBUG#define DEBUG_CLIENTBLOCK   new( _CLIENT_BLOCK, __FILE__, __LINE__)#else#define DEBUG_CLIENTBLOCK#endif#define _CRTDBG_MAP_ALLOC#include <crtdbg.h>#ifdef _DEBUG#define new DEBUG_CLIENTBLOCK#endif int _t

JSP中遍历map里的list,或者 遍历list里的map

遍历map里的list遍历map <c:forEach items="${uMap}" var="map"> 获取map key ${map.key} 遍历map 下list <c:forEach items="${map.value}" var="list"> 如果list是个对象,可以用list.属性 获取这个对象的属性 获取list内容 ${list.属性} ${list.属性} ${list.属

ios去掉navigationController和tabBarController里的边框黑线

ios去掉navigationController和tabBarController里的边框黑线 by 伍雪颖 - (void)viewWillAppear:(BOOL)animated { [self.navigationController.navigationBar setBackgroundImage:[TDUtils createImageWithColor:[UIColor clearColor]] forBarMetrics:UIBarMetricsDefault]; [self.

去掉firefox点击按钮时的虚线边框

去掉火狐里面点击按钮时候的虚线边框 button::-moz-focus-inner, input[type="reset"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="file"] > input[type="button"

需求:过滤下面这个网页里共723行 校对中里 行数为两位数的 行 并设置sz和rz在Windows和Linux之间发送和接收文件不用搭FTP

需求:过滤下面这个网页里共723行 校对中里 行数为两位数的 行 因为翻译当然要选择行数少的来翻译,翻译PG文档 https://github.com/postgres-cn/pgdoc-cn/wiki/check9.3grep  -E  "共[0-9]{2}行"  check9.3 [[email protected] ~]# grep  -E  "共[0-9]{2}行"  check9.3 |wc -l32 打开SecureCRT软件 -> Options

Log4.Net 在Winfrom、MVC、ashx程序里的使用,ashx程序里使用异步

最近做一个双11活动的,是一套相关的H5页面.本来以为难度不大,但是做下来几天还是遇到些问题.就总结一下吧,还是有收获的. 1.在H5页面中,有一个遮罩层,还是挺有意思的.直接用div+css控制遮罩层页面. <!DOCTYPE html > <head> <title>DIV CSS遮罩层</title> <script language="javascript" type="text/javascript"&

ACM数论-欧几里得与拓展欧几里得

ACM数论--欧几里得与拓展欧几里得 欧几里得算法: 欧几里德算法又称辗转相除法,用于计算两个整数a,b的最大公约数. 基本算法:设a=qb+r,其中a,b,q,r都是整数,则gcd(a,b)=gcd(b,r),即gcd(a,b)=gcd(b,a%b). int gcd(int a,int b) { return b ? gcd(b,a%b) : a; } 扩展欧几里德算法: 基本算法:对于不完全为 0 的非负整数 a,b,gcd(a,b)表示 a,b 的最大公约数,必然存在整数对 x,y ,使

居里先生的猜想 | 皮埃尔&middot;居里诞辰160周年

皮埃尔·居里(Pierre Curie)先生坐在桌前,手里把玩着一块小磁铁.忽然,一道闪念跃入脑海,他为自己这个大胆的想法激动不已,忍不住伏案疾笔书写起来.不远处,一位安静的青年女子温情脉脉地注视着他.窗外,阳光明媚,风吹,树动,影动,心动. 这是公元1894年,已经三十五岁的居里先生依然是巴黎城内一个籍籍无名的大龄单身男青年.虽然他有一份正当的职业,在巴黎市立物理化学学校作一名物理教师,但是微薄的收入仅够勉强安身.他没有独立住房,每天下班后赶回郊区,与父母住在一起.这样的日子虽然清贫,却也简单