Geek Answers Handbook

JQuery UI Elements image not shown

I am using the jQuery DatePicker element on my website. But I can’t see the small arrows that are shown on both sides of the month above. The area is viewable, and I view the months by clicking on the area. But actually it is empty and the shooter is not visible.

For example: '<' July 2013 '>'

I ran into a similar problem in the close button of jQuery Dialog Control. Here the image of the close button, something like β†’ 'X', will not appear in the upper right corner. But clicking on this area closes the dialog.

<head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <link rel="stylesheet" href="styles/jquery-ui.css" /> <script language="javascript" type="text/javascript" src="js/jquery.js" ></script> <script language="javascript" type="text/javascript" src="js/jquery-ui.js"></script> </head>

This is what the input file sequence looks like. Below is the link I'm talking about. I used the css file located at this link to download.

http://jqueryui.com/datepicker/#default

Please, help.

+7
jquery css jquery-ui
source share
2 answers

Thanks guys for your help, I found!

 .ui-widget-header .ui-icon { background-image: url(images/ui-icons_222222_256x240.png); }

This is the image path that makes the goal. The file is the same as code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css.

I am very happy for the help. Thanks again @ j08691, @Tim B James, @John ツ, @Lopsided !! :)

+5
source share

The problem is the location of the image files in relation to the CSS file. The jQuery UI CSS tables reference various image files used in the user interface. You must store all files in the CSS folder and reference them. Although I found that you can move these CSS folders if necessary. Here is a site that I use with several jQuery user interface themes.

List of my directories:

enter image description here

And here are the links from my code:

enter image description here

I am coding in ASP.NET, so I just ignore tags for storing content.

* ALSO STORE IN A VARIETY ... Each theme folder that you see in my directory list (for example, "dark theme") is a subfolder created in the "CSS" folder when you use jQuery Custom ThemeRoller . If you used the default jQuery library, I believe that the image folder and CSS files are located directly in the CSS folder. **

BONUS INFORMATION: When using jQuery Themeroller, they allow you to use multiple themes using their "CSS scope" tag. You can use this function by entering the desired class name in the provided text box (classes must have a prefix of periods such as in the jQuery selector). If you use multiple themes, you only need to call jQuery once, and then specify each CSS file you need. This is what I did in my example, and therefore it may look a little more complicated than yours when you are done.

+7
source share

More articles:


All Articles