Загрузка пользовательского интерфейса 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, проект загружен.