`

如何去掉点击链接时周围的虚线框outline属性<转>

 
阅读更多

如果全盘否定掉链接虚线框,对使用键盘的用户体验可能又是个大弊端。但这就是另外一个话题了,这里就不说了,不然就扯出UI设计和用户体验这个大话题了,我这小小的地方可说不清楚呢。

以下是解决方案:

 

方法一:
在IE下是使用html属性:hideFoucs,在HTML标签中加上hidefocus=”true” 属性即可,但这个属性是IE私有的,Firefox是不认的。

 

<href="#" hidefocus="true" title="加了hidefocus" >欢迎来到博客园(加了hidefocus属性)</a>


Firefox的处理方法比较符合标准,只需要在样式里设置a:focus{outline:none}皆可:

.xzw_test a.setFocus:focus{outline:none}

 

方法二:

 

通过javascript方法让其点击后失去焦点从而达到没有虚线框,也不失为一种曲线救国的方案:

 

1//通过判断可以指定某个必要的链接失去焦点
2if(j(this).attr("id")=="jsControl"
3  j(this).blur();

 

分享到:
评论

相关推荐

    去掉点击链接时周围的虚线框outline属性

    &lt;a&gt;欢迎来到博客园(加了hidefocus属性)&lt;/a&gt; Firefox的处理方法比较符合标准,只需要在样式里设置a:focus{outline:none}皆可: .xzw_test a.setFocus:focus{outline:none} 方法二: 通过javascript方法让其点击后...

    MyEclipse 6 Java 开发中文教程第十章

    193&lt;br&gt;&lt;br&gt;10.2.3 Spring Beans 视图和Outline视图... 197&lt;br&gt;&lt;br&gt;10.2.4 运行和测试... 199&lt;br&gt;&lt;br&gt;10.3 开发Spring 1.2 AOP应用... 200&lt;br&gt;&lt;br&gt;10.3.1 开发Man对象... 201&lt;br&gt;&lt;br&gt;10.3.2 开发前置通知(Before ...

    JPEG软件解码源代码

    JPEG软件解码源代码,下附软件文档部分说明:&lt;br&gt;Overview:&lt;br&gt; Functions provided by the library&lt;br&gt; Outline of typical usage&lt;br&gt;Basic library usage:&lt;br&gt; Data formats&lt;br&gt; Compression details&lt;br&gt; ...

    台湾神达电脑集团pcb设计规范PDF档.pdf

    外型線規定(BOARD OUTLINE)&lt;br&gt;7. 定位靶(TARGET) &lt;br&gt;8. 各層圖面(LAYERING)&lt;br&gt;9. PAGE 表格(PAGE FORM)&lt;br&gt;10. 銲墊(PAD)&lt;br&gt;11. 零件腳距(PIN LEAD PITCHES)&lt;br&gt;12. 線寬(TRACE WIDTH)&lt;br&gt;13. 間...

    四级英语真题

    &lt;br&gt;C)To resign from his position in the woman's company.&lt;br&gt;D)To exchange stock market infotmation with the woman.&lt;br&gt;&lt;br&gt;20.&lt;br&gt;A)He is head of a small teading company.&lt;br&gt;B)He works in an ...

    visual assist v 10.4.1632 with crack

    (case=9436) &lt;br&gt;STL list&lt;&gt; and vector&lt;&gt; member lists appear correctly following a "using namespace std::list" or "using namespace std::vector" directive. (case=12345) 7226 &lt;br&gt;Empty C++ preprocessor ...

    visual assist 1640

    &lt;br&gt;http://www.wholetomato.com/binaries/VA_X_Setup1640.exe&lt;br&gt;&lt;br&gt;这个版本已经是正式版了,稳定性没的说,中文的问题已经得到了很好的解决,已经可以正常显示了,只是包含有中文的注释,在va outline中显示为...

    G.729音频压缩传输协议(IP电话)

    G.729音频压缩传输协议(IP电话)&lt;br&gt;&lt;br&gt;CODING OF SPEECH AT 8 kbit/s USING CONJUGATE-STRUCTURE&lt;br&gt;ALGEBRAIC-CODE-EXCITED LINEAR-PREDICTION (CS-ACELP)&lt;br&gt;&lt;br&gt;This Recommendation contains the description ...

    CSS教程:text-indent隐藏文字出现虚线框outline

    隐藏文字,此效果在 IE 中是正常的,但在 Firefox 里,鼠标点击该链接时,虚线框却会包住被缩进的文字,结果显示为虚线框 N 长。  因为平时是用overflow:hidden; 属性的,所以一直也没有注意到这个问题的存在,但...

    jQuery的漂亮手风琴动画特效.zip

     &lt;i class="icon ion-social-codepen-outline"&gt;&lt;/i&gt; &lt;span&gt;456&lt;/span&gt; &lt;/a&gt;  &lt;/div&gt; &lt;/div&gt; 这是一款设计时尚漂亮,颜色搭配非常好的CSS3手风琴动画特效,带动画效果的手风琴切换代码。

    Outline of Programming with C

    Outline of Programming with C&lt;br&gt;&lt;br&gt;Chapter 1 INTRODUCTORY CONCEPTS ......................................................................................... 1 &lt;br&gt;1.1 Introduction to Computers ........

    amcharts中文教程(柱状图,饼状图等的中文设置说明)

    &lt;outline_color&gt;&lt;/outline_color&gt; &lt;!-- 轮廓的颜色[#FFFFFF] (hex color code) --&gt; &lt;outline_alpha&gt;&lt;/outline_alpha&gt; &lt;!-- 轮廓透明度[0] (Number) --&gt; &lt;base_color&gt;&lt;/base_color&gt; &lt;!--...

    heading-outline:显示 html 页面标题的语义结构

    &lt; h1&gt; heading &lt; span&gt; 1 &lt;/ span&gt; &lt;/ h1&gt; What is going on? &lt; h2&gt; heading 2 &lt;/ h2&gt; &lt; h3&gt; &lt; strong&gt; heading 3 &lt;/ strong&gt; &lt;/ h3&gt; &lt; h2&gt; heading 2b &lt;/ h2&gt; wat &lt;/ body &gt; &lt;/ html &gt; 像这样...

    cadence allegro 17.2 design outline的使用问题

    17.2中使用designe outline 代替outline,放置电路板外观,及Design Outline,这个和17.2之前的版本不一样,不能使用画线的方式添加Designe Outline,因为画线时在Board Geometry类中并未能找到Design Outline或Cut...

    opml-to-json:将 OPML 转换为 JSON(JavaScript 对象)

    opml-to-json 将 OPML 转换为 JSON(JavaScript 对象)。安装npm install opml-to-json用法示例 OPML 文件。... &lt; outline xss=removed&gt; &lt; outline xss=removed&gt; &lt; outline xss=removed&gt; &lt; outline text =

    Systematic Software Testing 2002

    Systematic Software Testing &lt;br&gt;by Rick D. Craig and Stefan P. Jaskiel ISBN:1580535089 &lt;br&gt;Artech House... and the authors outline a flexible process for improving software testing capabilities.&lt;br&gt; &lt;br&gt;

Global site tag (gtag.js) - Google Analytics