Предыдущие / следующие значки не отображаются в настраиваемой теме jquery datepicker

Question

Я реализовал jQuery DatePicker в своем проекте VS2010, и он отлично работает с одной небольшой проблемой.Когда я реализовал собственную тему, я потерял свои предыдущие и следующие значки (для перемещения по месяцам).

Вот изображение:

ВотСсылки на библиотеки jquery:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.min.js"></script>
<script type="text/javascript" src="~/lightbox/js/prototype.js"></script>
<script type="text/javascript" src="~/lightbox/js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="~/lightbox/js/lightbox.js"></script>
<link type="text/css" rel="stylesheet" href="~/lightbox/css/lightbox.css" media="screen" />
<link type="text/css" rel="Stylesheet" href="~/Scripts/jquery-ui-1.8.9.custom.css" />

Вот мои ссылки на изображения в jquery-ui-1.8.9-custom.css

/* states and images */
.ui-icon { width: 16px; height: 16px; background-image: url(~/images/jquery/ui-icons_469bdd_256x240.png); }
.ui-widget-content .ui-icon {background-image: url(~/images/jquery/ui-icons_469bdd_256x240.png); }
.ui-widget-header .ui-icon {background-image: url(~/images/jquery/ui-icons_d8e7f3_256x240.png); }
.ui-state-default .ui-icon { background-image: url(~/images/jquery/ui-icons_6da8d5_256x240.png); }
.ui-state-hover .ui-icon, .ui-state-focus .ui-icon {background-image: url(~/images/jquery/ui-icons_217bc0_256x240.png); }
.ui-state-active .ui-icon {background-image: url(~/images/jquery/ui-icons_f9bd01_256x240.png); }
.ui-state-highlight .ui-icon {background-image: url(~/images/jquery/ui-icons_2e83ff_256x240.png); }
.ui-state-error .ui-icon, .ui-state-error-text .ui-icon {background-image: url(~/images/jquery/ui-icons_cd0a0a_256x240.png); }

Я изменил путь, чтобы он указывал нафайлы.Не уверен, что мне не хватает.

Любая помощь будет принята с благодарностью.

Спасибо.

Answer 1

Вы уверены, что ваши пути указаны правильно (AKA, вы видите значки jQuery UI в других местах на вашем сайте)?Это первое, что я бы проверил ... особенно потому, что вы изменили путь.Возможно, вы случайно что-то напортачили.

Обновление

Я думаю, вам нужно исправить ваши пути - я не думаю, что они указывают правильно.Из того, что я вижу, они должны быть связаны с вашим файлом .custom.css.Так, например, мой файл jquery-ui-1.8.9.custom.css находится в моей папке Content.На мои состояния и изображения ссылаются так:

.ui-icon { width: 16px; height: 16px; background-image: url(images/ui-icons_cccccc_256x240.png); }

Поэтому мне нужно разместить папку с изображениями на том же уровне, что и jquery-ui-1.8.9.custom.css, и поместить все изображения внутриэта папка.Попробуйте и посмотрите, решит ли это проблему для вас.

Answer 2

Для меня проблема была в том, что Themeroller добавлял двойные кавычки вокруг путей к изображениям.Я просто удалил их из своего CSS-файла, и все заработало.

т.е. я изменил:

url("images/ui-bg_highlight-hard_100_fafaf4_1x100.png")

на:

url(images/ui-bg_highlight-hard_100_fafaf4_1x100.png)

во всем файле CSS.

Answer 3

У меня тоже была эта проблема. Я вырывал свои волосы. Но да, JasCav верен, вы должны поместить папку «images» на том же уровне, что и файл query-ui-1.8.9.custom.css (или в моем случае jquery-ui-1.8.16.custom.css) , И внутри этой папки скопируйте ваши * .png файлы из вашей загрузки jquery ui.

Answer 4

У меня была точно такая же проблема, и я наконец решил ее.

Проблема связана с правами на каталог 'images'.Мне пришлось сделать каталог доступным для просмотра для других, используя команду chmod:

chmod o+rx images

Надеюсь, это поможет

Answer 5

Позвольте мне поделиться решением для моего случая. Мой проект ASP.NET MVC имеет следующую структуру каталогов:

• Содержание
  • Темы
    • база
      • изображения
        • icon1.png
        • icon2.png
      • JQuery-ui.css
• Другие каталоги

Когда я запускаю приложение локально через Visual Studio, в jquery-ui.css я могу ссылаться на значки, используя следующий URL: url ("images / icon1.png") . Но когда я запускаю приложение на сервере Azure, я должен ссылаться на этот значок с помощью: url ("themes / base / images / icon1.png") . Оказалось, что настоящий «рабочий» / «текущий» каталог для jquery-ui.css - это каталог Content . Это потому, что в cshtml я загружаю jquery-ui.css, используя пакет, который я создаю следующим образом:

bundles.Add(new StyleBundle("~/Content/cssjqryUi").Include("~/Content/themes/base/jquery-ui.css"));

Кажется, что VS "суперинтеллектуален" и ищет упомянутые изображения также внутри подкаталогов.

Решением может быть использование внутри файла jquery-ui.css абсолютного URL-адреса к изображениям: url ("/ Content / themes / base / images / icon1.png") (или правильный путь относительно каталога Content в моем случае, т.е. url ("themes / base / images / icon1.png"), как я уже упоминал выше) или для создания пакета с более вложенным путем:

bundles.Add(new StyleBundle("~/Content/themes/base/cssjqryUi").Include("~/Content/themes/base/jquery-ui.css"));

Другое (хуже в моем opinoin) решение - загрузить файл css в cshtml, используя элемент <link>: <link rel="stylesheet" href="~/Content/themes/base/jquery-ui.css" />

Answer 6

кто читает этот вопрос, если вы используете этот сборщик дат http://www.malot.fr/bootstrap-datetimepicker/

Вы добавите эту опцию: bootcssVer: 3

 $( ".date" ).datepicker( "option", "changeMonth", true, **"bootcssVer" : 3** );

Значок покажет !!!

Answer 7

Поместите папку изображений с файлами значков в то место, где существует файл .css.

Answer 8

Я тоже был против этого.Я прочитал ответы, приведенные выше, и они не соответствуют 100% моего опыта на июль 2012 года. Я не знаю, был ли вообще изменен пользовательский интерфейс ThemeRoller с тех пор, как этот вопрос был впервые задан, что может объяснить предыдущие комментарии / ответы,Однако для меня эти ответы слишком усложняют то, что должно быть сделано, и поэтому они вводят меня в заблуждение.

Что сработало для меня: -

1. Используйте ThemeRoller, чтобы создать собственную тему.
2. Загрузите тему - например, в каталог my_Work_Area за пределами вашего проекта.
3. Распакуйте загрузку в my_Work_Area
4. Просмотрите файл index.html после распаковки - проверьте, что стиль выбора даты соответствуетстиль, протестированный в ThemeRoller.Если нет, вернитесь к ThemeRoller и повторите 1-3.
5. скопируйте my_Work_Area / js / jquery-ui-1.8.21.custom.min.js в папку jquery в вашем проекте, например _public / _jquery /jquery-ui-1.8.21.custom.min.js
6. при необходимости аналогичным образом скопируйте jquery-1.7.2.min.js
7. скопируйте my_Work_Area / css / custom-theme / jquery-ui-1.8.21.custom.css в папку css в вашем проекте, например _public / _css / jquery-ui-1.8.21.custom.css
8. скопировать папку my_Work_Area / css / custom-theme / imagesв папку css в вашем проекте, например _public / _css / images

9. , согласно документации убедитесь, что в ваш html

   <link rel="stylesheet" type="text/css" href="../_public/_css/jquery-ui-1.8.21.custom.css" />
   <script type="text/javascript" src="../_public/_jquery/jquery-1.7.1.js"></script>
   <script type="text/javascript" src="../_public/_jquery/jquery-ui-1.8.21.custom.min.js"></script>
   

* 1027 включено следующее* Это все, что вам нужно сделать.

Может быть, стоит рассмотреть вопрос о целесообразности наличия папки с названием images внутри вашей папки css.Изменение местоположения этой папки потребует рассмотрения используемых путей.

Но если вы просто хотите, чтобы пользовательский интерфейс работал «из коробки», вышеприведенное работает без необходимости делать что-либо сложное.

Надеюсь, это поможет.

Answer 9

У меня была такая же проблема.Создал каталог изображений под моим именем темы и перетащил все gif-файлы и png-файлы из темы в новый каталог изображений.работал как шарм, не путаясь с путями.

Я думаю, что приложение themeroller в JQuery_ui не упаковывает изображения в каталог изображений, и оно должно.

В любом случае, верните путьвернуться к тому, как это было, и попробовать.Удачи.

Кстати, похоже, вы помещаете свой custom.css в папку скриптов, которая становится грязной, я только что указал на копию папки тем.т.е.

link href = "../../ Content / themes / humanity / jquery-ui-1.8.13.custom.css" rel = "stylesheet" type = "text / css"