Загрузка пользовательского интерфейса jQuery: Хорошо, а какую часть этого беспорядка я могу скопировать на сервер?

Из файлов "должно быть просто, но...": попытка начать с пользовательского интерфейса jQuery. Пошел на сайт, использовал свой собственный сборщик, чтобы собрать нужные мне детали, сделал себе настраиваемую тему с помощью ролика темы, загрузил созданный zip файл, разархивировал его на своем локальном диске. Итак, у меня 37 папок, 311 файлов и всего 2,4 МБ. Разве это не путь в ад, все это происходит на сервере. Какие части мне нужно разместить там?

'CSS'
- 'custom-theme': jquery-ui-1.8.custom.css, подпапка 'images' с 12 изображениями .png
'развитие-расслоение'
- 'demos': demos.css, index.html, плюс 18 подпапок, но я предполагаю, что "не нужно"
- 'docs': 17.html файлов, но опять же, я предполагаю, что "не нужно"
- 'external': файлы .js, один .css
- 'themes': подпапки "base" и "custom-theme", каждая из которых содержит 8 или 9 файлов .css и подпапку "images" с примерно дюжиной изображений
- 'ui': 25.js files, подпапка 'i18n' с 53 файлами .js и вложенная папка 'minified' с 24 файлами .js
'js': jquery-1.4.2.min.js и jquery-ui-1.8.custom.min.js

Кроме того, файловая структура. Наш сервер настроен примерно так:

корень
- admin (административные инструменты)
- CSS
- (сущность сайта здесь).
- изображения
- include (фрагменты кода ASP, которые используются несколькими страницами)
- js (всего несколько вещей прямо сейчас, как древняя хрипящая проверка орфографии).

Насколько я могу судить, файлы css jQuery предполагают, что (1) каждая тема находится в своей собственной папке, и (2) каждая папка имеет свою собственную подпапку изображений. Как я могу убедить это иначе? т.е. поместить необходимые .js файлы в папку "js", файлы .css в папке "css" и изображения в папке "images"?

Ответ 1

Обычно я копирую jquery-ui-1.8.custom.css и jquery-ui-1.8.custom.min.js вместе с изображениями на свой сервер. Вам также понадобится файл jquery-1.4.2.min.js, если он еще не установлен на вашем сервере. Остальное я не использую.

Если вы помещаете изображения в каталог изображений, вам ничего не нужно менять.

Вам действительно ничего не нужно в комплекте для разработки. Он содержит кучу демонстраций и все готовые темы, если вы хотите поэкспериментировать с ними.

Эта ссылка содержит дополнительную информацию о начале работы с пользовательским интерфейсом jQuery: http://learn.jquery.com/jquery-ui/getting-started/

Ответ 2

Нет никакой проблемы при размещении файлов css и js, поскольку вы все равно будете включать их в свой html.

Для изображений, однако, вам нужно будет изменить css. Отредактируйте файл css и найдите ссылки на изображения, например

background: url(path/to/image.jpg)

и измените его на подходящее местоположение

Ответ 3

В моих проектах я использую только папку css вместе со своей папкой с изображениями и jquery-ui-1.8.custom.min.js. Если вы еще не используете jQuery, вам, конечно же, нужно будет ссылаться на это, прежде чем ссылаться на файл jQuery UI.js. Я не думаю, что вам нужно что-то в этой папке dev.

Ответ 4

Просто разместите файлы jQueryUI js в выбранной вами папке (то есть на вашем сервере), а затем поместите его в свой HTML-код вверху, как показано ниже (и не забудьте разместить его после того, как ваша библиотека jQuery также включена):

<script src="js/vendor/jquery-1.10.2.min.js"></script>
<script src="js/vendor/jquery-ui-1.10.4.custom.min.js"></script>

Сложная часть - это то, где идут изображения и jQueryUI css файл. Я обнаружил, что лучшим местом для изображений является копирование всей папки пользовательских тем в вашу текущую папку css, а затем ссылку на jQueryUI css из папки настраиваемых тем. Таким образом, файл css jQuery будет знать, где найти нужные ему файлы изображений, как показано ниже:

<link rel="stylesheet" href="css/custom-theme/jquery-ui-1.10.4.custom.css" />

Ответ 5

Просто скопируйте весь каталог и привяжите его к jquery-ui.css. Помните, что для этого нужен каталог "images", поэтому сохраните структуру без изменений, и если вы хотите переключать темы, просто измените каталог.

Чтобы отредактировать эту тему в Theme-roller

Откройте указанный файл, найдите строку 4 (YMMV), где он говорит:

* To view and modify this theme, visit http://jqueryui.com/themeroller/?

Скопируйте всю строку, да, она огромная, и откройте ее в своем браузере. Presto, проект загружен.