当我们点击链接后,链接周围会显示一个虚线框,那么怎么去掉这个虚线框呢?其实方法还挺多,用CSS就可以,但使用javaScript似乎也是一个好方法。
1. CSS方式去掉链接虚线框的方法:
在IE下是使用html属性:hideFoucs,在HTML标签中加上hidefocus=”true” 属性即可,但这个属性是IE私有的,Firefox是不认的。前端框架示例
<a href="#" hidefocus="true" title="加了hidefocus" >加了hidefocus属性</a>
IE中用CSS处理:
a{noOutline:expression(this.onFocus=this.blur());}/* "onFocus" 注意大小写*/
Firefox的处理方法比较符合标准,只需要在CSS样式代码里设置a:focus{outline:none}皆可。接下来看一下MSIE和FF中统一处理的方法:
a{ outline:none; /*FF*/ noOutline:expression(this.onFocus=this.blur());/*IE*/ }
考虑性能优化,可参考以下代码:
a{outline:none;} a:active{noOutline:expression(this.onFocus=this.blur());} :focus{outline:0;}
2. 用js方式解决链接虚框的方法:前端框架示例
<script language="javascript"> $("a").bind("focus", function(){ if(this.blur){ this.blur(); } }); </script>
相关推荐
本文使用JS、CSS、标签属性等方式去除IE链接上的虚线框,方法很简单,大家可以选择使用
介绍: 方法二: 在页面中加入下面CSS代码即可
IE升级过后常常出现这样的问题:浏览网页中的FLASH的时候,鼠标放上去会出现虚线框,并提示“单击以激活并使用此控件”,需要多点击一次才能正常播放,这即影响美观(鼠标划时会有一个框),又不方便。 在IE,Maxthon...
24.去掉点击链接时出现的...41.用CSS+JS控制Li背景颜色交替.html 42.用css实现简单的进度条.html 43.在同一页面设置不同文字链接效果的样式.html 44.支持按键盘方向键实现翻页跳转的效果.html 45.支持键盘方向键.html
实例212 虚线边框表格 330 实例213 表格作为分割线 332 实例214 表格向下展开 332 第8章 图形图像与多媒体 335 8.1 图片大小 336 实例215 打开自定义大小的图片 336 实例216 图片放大缩小 337 实例217 通过鼠标滚轮...
去除点击超级链接时的虚线显示 chromeless_win_wind 制作弹出无边浏览小窗口,现在网上最为流行的 scrollablearea 使用层制作IE中可控制上下滚动的看板 right_click_menu_builder 右键菜单扩展功能 flashtext 制作仿...
scrubber 去除点击超级链接时的虚线显示 chromeless_win_wind 制作弹出无边浏览小窗口,现在网上最为流行的 scrollablearea 使用层制作IE中可控制上下滚动的看板 right_click_menu_builder 右键菜单扩展功能 ...
scrubber 去除点击超级链接时的虚线显示 chromeless_win_wind 制作弹出无边浏览小窗口,现在网上最为流行的 scrollablearea 使用层制作IE中可控制上下滚动的看板 right_click_menu_builder 右键菜单扩展功能 ...