javascript - jquery UI datepicker transparent background - Stack Overflow

admin管理员组

文章数量:1296288

This seems to be a mon question but I've tried many answers but none of them have worked for me.

I'm using jquery UI datepicker. Something seems to be wrong. This is how I see it.

I've included the below in my file

• jquery-1.11.2.min.js
• jquery-ui.min.js (version 1.11.4)
• jquery-ui.min.css (version 1.11.4)

Also I've tried the below css but did not work.

.ui-datepicker {
  background: #fff !important;
  z-index: 10000;
}

How do I make it look normal?

This seems to be a mon question but I've tried many answers but none of them have worked for me.

I'm using jquery UI datepicker. Something seems to be wrong. This is how I see it.

I've included the below in my file

• jquery-1.11.2.min.js
• jquery-ui.min.js (version 1.11.4)
• jquery-ui.min.css (version 1.11.4)

Also I've tried the below css but did not work.

.ui-datepicker {
  background: #fff !important;
  z-index: 10000;
}

How do I make it look normal?

• javascript
• jquery
• css
• jquery-ui
• datepicker

Share Follow edited Mar 23, 2015 at 16:14 Mr. Polywhirl 48.7k1212 gold badges9393 silver badges144144 bronze badges asked Mar 23, 2015 at 16:12 FergosoFergoso 1,58233 gold badges2222 silver badges4545 bronze badges 17

• Is that the only CSS you have? – j08691 Commented Mar 23, 2015 at 16:16
• 1 And what is the order? make sure you load jquery before jquery ui Also make sure you are not loading any jquery several times (can happen if u use bundles) – Ziv Weissman Commented Mar 23, 2015 at 16:19
• 1 What do you mean "jquery related css"? Any other CSS could be affecting the calendar. It all depends on what you have. – j08691 Commented Mar 23, 2015 at 16:21
• 1 In chrome try right clicking on the element and selecting "inspect element" then look through the "styles" panel for any rules that might be causing this effect. You can uncheck them to see what happens if they were removed – Wesley Smith Commented Mar 23, 2015 at 16:26
• 1 @j08691: the issue was due to the missing image folder which e with the jquery. – Fergoso Commented Mar 23, 2015 at 19:19

 |  Show 12 more ments

1 Answer 1

Sorted by: Reset to default 7

I set up a fiddle with the basic datepicker theme and a colored background (or transparent if you so wish): http://jsfiddle/uscmr3xo/3/

.ui-datepicker {
    /*background: transparent;*/
    background: blue;
}

It turned out "background" does the magic while "background-color" doesn't. For some reasons theres no transparent BG in the jquery-ui ThemeRoller (http://jqueryui./themeroller/). But if you want to use different color/styling schema please use the tool. Be careful customizing CSS to overwrite the default jquery-ui styles.

本文标签： javascriptjquery UI datepicker transparent backgroundStack Overflow