it-swarm.com.ru

jQuery datepicker prev и next кнопки не показывают, как указать на изображения папки темы в css

Я использовал средство выбора даты jQuery ui, чтобы успешно добавить элемент управления календаря в мое текстовое поле, но предыдущие и следующие кнопки не видны, хотя содержащийся тег работает функционально при нажатии

Как я могу изменить это, чтобы отображать значки, показанные на http://jqueryui.com/datepicker/ когда эти изображения находятся в моем веб-пакете по адресу ..\Content\theme\base\images, а не места, показанные ниже

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

Нужно ли вызывать изображение в css аналогично тому, как изображения вызываются из моего кода на c #? Как в:

"@Url.Content("~/Content/theme/base/images/ui-icons_222222_256x240.png")"
19
Jay

Убедитесь, что ваш jquery-ui.min.css указывает на правильный файл для изображений. Консоль должна отображать ошибку при попытке загрузить значки.

Например, если это местоположение вашего CSS-файла: http://example.com/css/jquery-ui.min.css, тогда файл значка должен быть в http://example.com/css/images/ui-icons_222222_256x240.png. Ссылка в файле CSS относится к файлу CSS, а не к файлу HTML, загружающему его.

34
Mooseman

Вы почти там.

Просто убедитесь, что вы изменили свой URL-адрес и добавьте "! Важно" в конце строки.

Это позволит вам добавить любое изображение по вашему желанию.

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

Надеюсь, что это работает для вас.

3
Francois Muller

Из сообщения об ошибке я заметил, что сайт ищет: 

http://site/Content/images/image.png

Я не совсем уверен, почему, как из ответа Мусман: 

Ссылка в файле CSS относится к файлу CSS, а не к файлу HTML, загружающему его.

Кажется, что ссылка была относительной от site.css (которая содержится в Content), а не Jquery-ui.mincss, и поэтому она явно не смогла найти png. 

После изменения пути в JQuery-ui.min.css на

themes/base/images/image.png 

Теперь это работает отлично.

0
Bassie