2011-09-01 15 views
0

我有一個按鈕(由設計者創建),無法用background + border radius表示(它具有3D效果,所以「radius 。「應該是一個形象,以及如何使用jquery-ui主題來設計需要2張圖片的按鈕

距離教程like this one清楚如何讓這樣的按鈕然而,jQuery的UI似乎只有這些(有關)類:

  • .ui-state-default持有的按鈕和其他組件的背景圖像
  • .ui-button - that定義僅按鈕屬性。

但代碼中只有一個<input,所以它不能有兩個圖像,有沒有辦法有$("..").button()同時使用的圖片?我想我可以在<button>之內有一些跨度,但是到處都是麻煩的。

回答

0

有與按鈕相關的幾個州和所有小工具:

以下是相關類和它們相對於按鈕控件:

  • ui-state-default
    • 按鈕屬性,因爲它出現在頁
  • ui-state-active
    • 如被點擊
  • ui-state-hover
    • 的按鈕屬性,因爲它是盤旋

在主題的CSS片的按鈕屬性有每個設置內這些按鈕設置通常具有從整理器設置的顏色或圖像。

如果您希望通過另一個樣式表或重寫整理器中的一個,則可以覆蓋默認屬性以使用自己的圖像。

您還可以通過設置顏色和不透明度,輕鬆設置整合器設置,爲您提供3D外觀。如果您只需要按鈕而不是整個頁面,請使用CSS範圍功能。

Themeroller is here

Themeroller example with similar button to your example

+0

我知道的三種狀態,但這並不與形成按鈕幫助(我只是將其形成3點不同的方式)。另外 - 如何通過「顏色和不透明度」來實現3D外觀? – Bozho

+0

好吧,對不起,我誤解了你剛纔的要求。你最好的選擇可能是在該教程中添加跨度。正如你所說,這在任何地方都很麻煩。如果你使用jQuery UI,我認爲你可能會停留在這裏編輯一些源代碼。您可以將按鈕小部件擴展到您自己的小部件中,並擴展功能以保持跨度以及... – jyore

+0

就整個美化器而言,您可以使用按鈕狀態的顏色和疊加效果的不透明度創建與該教程中非常相似的按鈕。設置邊界半徑爲一個巨大的數字將使它看起來像樣本頁上的膠囊樣式 – jyore

相關問題