2015-06-28 36 views
2

我已根據Foundation 5前端平臺創建了CMS。其中我創建了一個CSS生成器,它基本上允許通過在現場網站上進行管理來對整個樣式表進行SASS類型控制。如何控制Foundation 5中的Active/Focused按鈕上的CSS

該系統很好用,但是,我找不到如何控制出現在active/focused button上的box shadow樣式。這是產生在我的發電機focused button這是採取直接從基金樣式表的樣式代碼:

$code .= 'button:hover, button:focus, .button:hover, .button:focus{'; 
    $code .= 'background-color: '.changeColor($primary, $primary_hover_percent).';'; 
    $code .= 'border-color: '.changeColor($primary, $primary_border_percent_hovered).';'; 
    $code .= 'color: '.$primary_font_color_hovered.';'; 
    $code .= '}'; 

默認基金會適用原色作爲一個focused button一個box shadow。我的問題是我無法找到這發生的地方。由於box shadow屬性不在它們樣式表的這一部分,我假設它是由javascript控制的。

我已經搜索了通過javascript,但似乎無法找到任何代碼控制box shadow的加法。雖然我確信這是一個非常簡單的解決方案,但答案暗示我。任何援助非常感謝。

樣品

enter image description here

右邊的按鈕是主動/焦點的按鈕......如果你仔細觀察,你可以看到藍色的盒子陰影。

更好的視野

enter image description here

更新

我已經分離爲藍色的十六進制編碼,並已進行了兩個樣式表無濟於事顏色的搜索,並搜查所有的JS希望找到類似.active之類的addClass()的文件也無濟於事。再次,對此事的任何想法都非常受歡迎。

+0

你的意思是「主動」還是「聚焦」?就像在盤旋? –

+0

單擊該按鈕時,會出現一個與下載時的主色相同顏色的陰影。我正在使用該按鈕打開一個隱藏的窗體上用jquery點擊。點擊時,陰影出現並保持在那裏,直到焦點轉移到頁面上的輸入或其他區域。問題是隨着下載的默認顏色可能與用戶通過發生器改變的顏色不兼容。 – petebolduc

+0

我不知道基金會5有':焦點'或':主動'的'按鈕'有任何默認樣式。就此而言,':focus'僅適用於需要用戶輸入的元素。我唯一默認看到的是':hover'效果。必須在偶然的地方在某處拋出一些'SASS'。 –

回答

0

每天學習新東西...來找出這個問題與任何Foundation 5代碼無關。藍色陰影是Chrome中的瀏覽器設置,設置爲:focus,因爲可訪問性原因。在Firefox瀏覽器應用了一個虛線邊框。

與此問題相關的信息可以在這裏找到:

http://outlinenone.com/

分辨率:

CSS屬性是:outline

要解決我只是增加outline-style: none;到上面的代碼問題。

相關問題