jQuery UI的選項卡演示如何隱藏虛線焦點框？

如果您轉到the jQuery UI tabs demo，當您單擊一個或另一個選項卡時，樣式會相應更改，特別是，您不會看到惱人的虛線聚焦框，它會破壞選項卡標題的外觀。jQuery UI的選項卡演示如何隱藏虛線焦點框？

但是，該功能似乎並未包含在JavaScript或CSS中的選項卡中。令人討厭的焦點框出現在我正在開發的頁面上，而我並不是唯一一個;它也出現在 ~~sample vertical tabs demo~~ 鏈接到另一個問題（編輯二月4/13：現在鏈路斷開:( ）

我通過兩個演示頁和給出的代碼看起來。該頁面的完整源代碼，其CSS頁面和當前版本的jQuery UI選項卡代碼，並且無法計算出它是如何做到這一點的。

我最好的猜測是，它以某種方式通過擺弄大小的框屬性<li>或<a>元素在標籤頁眉，但我真的沒有看到它。

如果你知道它是如何完成的，請問你有多清楚地解釋它？ ETA：由幾個問題提示，我只是進一步檢查，它似乎只發生在Firefox 8.0.1（和更早？很難說）。 - 沒有其他瀏覽器似乎顯示焦點框現場;這是否意味着它是一個（自固定的）Firefox錯誤？即便如此，這並不能解釋爲什麼它發生在一個頁面上，而不是另一個頁面上。 ETA（2）：我真的很感謝人們對於如何做/應該做到這一點的建議，但我應該澄清，那不是我要問的。我已經閱讀過其他地方（主要是其他問題）關於擺脫那個盒子的方法，並且熟悉我迄今爲止看到的那些（同樣，沒有對這種努力和想法不太感激）。我感興趣的是如何在jQuery UI選項卡中進行具體演示，因爲 - 就我所能找到的 - 它沒有做任何這些事情。

編輯，2013年2月4日：當我去jQuery UI標籤演示，我現在看到標籤內的元素周圍的虛線。我不知道當我看到這種現象時，我使用的瀏覽器是否是一個缺陷（看起來很可能，因爲很多其他人似乎沒有看到它），或者是什麼。無論如何，我想這個問題是沒有意義的。

我真的很感謝每個花時間去尋找答案的人。謝謝！

來源

2012-02-24 Wilson F

哪種瀏覽器？我看不到在鉻中的虛線框。 – 2012-02-24 19:02:32

我沒有看到Firefox 10上的虛線框... – DarkAjax 2012-02-24 19:13:56

對不起，仍然習慣於Web開發的多個平臺。 Firefox，v8.0.1。我會在我的問題中解決這個問題。（我查了一下，也沒有在Chrome或IE中看到輪廓）。 – 2012-02-24 19:24:58

嘗試使用Javascript的.blur()方法。

來源

2012-02-24 19:02:02 SenorAmor

實際上，我發現有兩種或三種不同的方式來實現它（例如CSS：0）。我的問題來自這樣一個事實，即演示似乎沒有使用我在其他地方看到的任何技術。此外，對於它的價值（也許別人可以讓我知道，如果我錯了），我已閱讀（[這裏]（http://www.html-faq.com/scriptingnavigation/?removefocus），例如）模糊一個本來意義重大的元素對於可訪問性問題的人來說並不好。 – 2012-02-24 19:23:28

您對可訪問性問題是正確的。 – Mathletics 2012-02-24 19:25:02

也許你可以嘗試設置焦點其他元素如輸入框，文本區域或鏈接

來源

2012-02-24 19:08:04 apis17

設置outline:none在你的CSS

來源

2012-02-24 19:09:07 Ray

添加outline:none您a:active CSS，雖然這並不在早期工作IE版本。要確定您還需要將.blur()添加到製表切換事件。

來源

2012-02-24 19:23:45 Mathletics

使用本：

/* remember to define focus styles! */ 
:focus { 
    outline: 0; 
}

退房：http://www.outlinenone.com/

來源

2013-02-04 08:36:19 kelviN

jQuery UI的選項卡演示如何隱藏虛線焦點框？

回答

相關問題