a标签点击后的虚线框问题
以前一直用的方法都是:
a {outline: none;star:expression(this.onFocus=this.blur());}
后来发现有瑕疵,不完美。体现在页面调用JS动作比较频繁的情况下,页面很卡~~~半个月内遇到两次这个问题,都是自己公司的平台。而网上却没有关 于这个的说法·~~而大家也都是按部就班,我不得不写一写。
解决办法就是写成这样:
a:active {outline: none;star:expression(this.onFocus=this.blur());}
有 的人怀疑,未什么不直接写在a里呢,为什么不这样写呢a {outline: none;star:expression(this.onFocus=this.blur());}, 这样不是可以包含了所有的A了吗?其实这样理论上是对的,原来我也这么用,原来也发现没什么问题,可最近在做另一个项目的时候,页面调用的JS比较多,问 题就来了~整个页面会很卡,起初找不到原因,一直抓狂~~~后来一个个排除原因,最终找到罪魁祸首竟然是CSS样式表·~~
因 为如果写在A里,那么不管是鼠标放上,鼠标点击,还是默认,都会执行 star:expression(this.onFocus=this.blur());, 这个代码相对于IE来说就是一个CSS的动作调用,和JS原理一样,页面资源耗不起啊,也算是IE的BUG吧~~~我们实现的效果是要点击的时候没有虚 线,所以就写在a:active里就可以了,意思就是点击时才执行,才去掉虚线框。这样鼠标在放上A和默认的情况下就不会卡。
要同时兼容IE和火狐浏览器,样式直接写成以下就可以:
a {outline: none;}
a:active {star:expression(this.onFocus=this.blur());}
也可以单独写:
===IE===
为链接添加onFocus事件
if(this.blur)this.blur()或者用IE的私有属性hideFocus="hide";
===Firefox===
添加CSS
:focus{outline:0}
该CSS可以作为全局存在,即在样式表中单独存在一行该代码即可时全页面的链接不带有虚线框
===Chrome, Safari===
这两个浏览器在点击链接时本身没有虚线框
===Jquery框架===
如果你使用Jquery框架的话,可以添加以下代码即可实现(raycross 提供)
$(“a”).bind(“focus”,function() {
if(this.blur) {this.blur()};
});
最终我的用法是在CSS文件直接加入:
a {outline: none;}
a:active {star:expression(this.onFocus=this.blur());}
:focus { outline:0; }
如果页面上只有一两个链接的话,直接加到<a>里面也行,就像这样
<a href=”#” onFocus=”this.blur()”><img src=”logo.jpg” border=0></a>
a标签点击后的虚线框问题的更多相关文章
- css去掉a标签点击后的虚线框,outline,this.blur()
css去掉a标签点击后的虚线框,outline,this.blur() outline是css3的一个属性,用的很少.声明,这是个不能兼容的css属性,在ie6.ie7.遨游浏览器都不兼容. outl ...
- css去掉a标签点击后的虚线框
outline是css3的一个属性,用的很少. 声明,这是个不能兼容的css属性,在ie6.ie7.遨游浏览器都不兼容. outline控制的到底是什么呢? 当聚焦a标签的时候,在a标签的区域周围会有 ...
- css去掉a标签点击后的虚线框(转自网络)
outline是css3的一个属性,用的很少. 声明,这是个不能兼容的css属性,在ie6.ie7.遨游浏览器都不兼容. outline控制的到底是什么呢? 当聚焦a标签的时候,在a标签的区域周围会有 ...
- 【工作笔记四】去掉a标签超链接的虚线框的方法
a{ blr:expression(this.onFocus=this.blur()); /* IE Opera */ outline:none; /* FF Opera */ } a:focus{ ...
- IE10中KendoUI treeview 点击后出现虚线框的解决方案
在head中添加:<meta http-equiv="X-UA-Compatible" content="IE=edge"> 修改渲染模式即可.
- 去掉a标签点击后的虚边框
a { cursor: pointer; text-decoration: none; hide-focus: expression(this.hideFocus=true); outline: no ...
- html a标签 图片边框和点击后虚线框的有关问题
html a标签 图片边框和点击后虚线框的问题 一直在在chrome上开发自己的项目,今天上ie和firefix一看,真丑,a标签在使用图片时,多加了蓝色的边框,并且点击后所有a标签都会出现一个虚线框 ...
- 去掉点击a标签时产生的虚线框
1.直接给a 标签添加属性:onfocus="this.blur()" 即可 For Example: <a onfocus="this.blur()" ...
- 去掉A标签的虚线框
outline是css3的一个属性,用的很少. 声明,这是个不能兼容的css属性,在ie6.ie7.遨游浏览器都不兼容. outline控制的到底是什么呢? 当聚焦a标签的时候,在a标签的区域周围会有 ...
随机推荐
- 深入理解windows
阿猫翻译的,用作备忘 深入理解windows——session.window stations.desktops 翻译自:http://www.brianbondy.com/blog/id/100/ ...
- 防止vuejs在解析时出现闪烁
---## 防止vuejs在解析时出现闪烁 ## 原因: 在使用vuejs.angularjs开发时,经常会遇见在如Chrome这类能够快速解析的浏览器上出现表达式({{ express }} ),或 ...
- android初学-togglebutton
1.属性:textOn &textOff &checked 2.使用: 1)初始化:TB: 2)设置监听器:TB.setOnCheckedChangeListener(listener ...
- EXTJS 常用控件的使用
重要按钮配置项 handler: renderTo: 取得控件及其值 var memo = form.findById('memo');//取得输入控件 alert(memo.getValue()); ...
- Mac Yosemite OS10.10 Apache 虚拟主机设置
昨天睡觉前开始挂机下载OS10.10 Yosemite,早上6点半就很兴奋地起来安装新系统了.安装完成后打开界面,感觉真的大不一样了,很优很美,很喜欢. 在下载各种更新,体验各种新功能的同时,我也不忘 ...
- Objective-C ,ios,iphone开发基础:使用第三方库FMDB连接sqlite3 数据库,实现简单的登录
第一步:下载第三方库,点击 连接 下载, 第二部:准备数据库:按照连接&中博客的步骤实现数据库, 数据库的设计大致如下表: id username pas ...
- Android的按钮单击事件及监听器四种常见的实现方式
第一种:匿名内部类作为事件监听器类<ignore_js_op>大部分时候,事件处理器都没有什么利用价值(可利用代码通常都被抽象成了业务逻辑方法),因此大部分事件监听器只是临时使用一次,所以 ...
- asp.net页面与页面之间传参数值
一.利用POST传值 传值asp文件send.aspx 代码如下 复制代码 <form id="form1" runat="server" action ...
- Cocos移植到Android-通过命令行交叉编译打包
当我们在Windows下使用Visual Studio开发好Win32平台的游戏程序后,我们需要把它们移植到不同的平台上.Cocos2d-x支持很多个平台,然而,我们不可能介绍全部平台的移植.我们总结 ...
- JSON解析例子
//解析的东西是数组就用数组接受,是字典就用字典接受 //my.h#ifndef __1_Header_h#define __1_Header_h#define DEBUG 1#define aa 1 ...