2010-07-08 55 views
12

我有這個非常基本的jQuery UI的模態對話框,我測試here.寫道除非我失去了一些東西我想不通爲什麼他們是在頁面的中間是灰色地帶。我試圖操作模式背景顏色和不透明度以及在CSS標記中看到的。jQuery UI的模態對話框條紋問題

+0

你控制腳本插入頁面的底部,外''? – 2010-07-08 01:02:26

回答

28

的問題是,jQuery UI的定義的背景不只是一個純色:它是一個圖像(支持覆蓋圖中的條紋等圖案)。當您使用整合器自定義jQuery UI主題時,它會爲您生成彩色圖像。要解決您的網頁,所有你需要做的是從編輯的內嵌CSS在網頁上的48行:

background-color: #000; 

到:

background: #000; 

這將覆蓋整個背景規範,而不僅僅是顏色。

UPDATE: 尼克Craver提供的修補程序的演示在http://jsfiddle.net/QVXah/

+4

+1 - 即將發佈此,這確實是問題,這是一個演示與修復你想包括它在你的答案:http:/ /jsfiddle.net/QVXah/ – 2010-07-08 01:11:50

+0

這是一個非常方便的網站!我會盡量記住下次使用。 – sunetos 2010-07-08 01:18:01

+0

我認爲如果你完成了答案會更好。我的意思是,你會在哪裏應用這個背景:#000;'?只是爲了讀者的傳遞:) – Reigel 2010-07-08 01:20:02

0

我以前見過這個問題,我不知道爲什麼它一直未動。您應該能夠通過移除jQuery的ui.css線〜285從

.ui-widget-overlay { 
    url("images/ui-bg_flat_0_aaaaaa_40x100.png") repeat-x scroll 50% 50% #AAAAAA 
    ... 
    } 

解決它看看是否能爲你工作

+1

只是一個人擡頭,看看那個文件的託管位置......它可能不是一個選項:) – 2010-07-08 01:04:52

+0

恩,呃,自己託管文件呢? – 2010-07-08 01:05:54

+0

我在一些網站上有這個問題。我的這個解決方案(和其他問題)是從//ajax.googleapis.com的jquery加載我的css並覆蓋一些樣式。這樣,我可以從谷歌apis加載,但糾正這個東西... – 2014-03-09 22:10:57

14

這個問題是3歲以上,並且這個問題在jQuery中仍然存在。

什麼工作對我來說是重寫jQuery的CSS類定義的背景下,通過我自己的CSS文件

.ui-widget-overlay { 
    background: #000; 
} 

加入這個和裝載裝載jQuery的CSS後,我的CSS。現在我沒有看到這個煩人的柄,並得到一個很好的透明淺灰色背景。

您還可以設置

background: none; 

但是,這將使其混亂的用戶,因爲背景將仍然可見,但不起作用。

+0

我從CDN加載,所以更改文件不是一個選項。這很好! – Scottie 2014-06-13 22:00:32

1

我的解決方案是一個有點不同。而不是改變背景顏色,我做到了透明:

.ui-widget-overlay { 
    opacity: 0; 
} 

與其他類似的解決方案,我把這個中是從加載的jQuery的ui.css後加載的.css文件code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css。

我現在看到的只是彈出,沒有任何背景的副作用。

0

如果您使用的是CDN,不希望加載/維持另一個CSS,使用的重要替代:

.ui-widget-overlay {background: #BEBEBE !important;}