Загрузка jQuery UI CSS из CDN Google

Question

Я планирую использовать Google для загрузки библиотеки jQuery для пользовательского интерфейса и ядра. У меня вопрос, позволяют ли они мне загружать CSS или я должен сам его разместить?

Также, если я использую Google для загрузки, как я должен загружать другие плагины? Могу ли я сжать все плагины вместе или это должен быть отдельный файл?

Answer 1

API библиотек Google AJAX, который включает в себя пользовательский интерфейс jQuery (в настоящее время v1.10.3), также включает популярные темы в соответствии с блогом пользовательского интерфейса jQuery :

API библиотек Google Ajax (CDN)

• без сжатия: http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.js

• Сжатый: http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js

• Темы без сжатия: черный галстук , блицер , купертино , темный улей , точка-luv , баклажан , Excite-Bike , Flick , Hot-Sneaks , человечество , le-frog , мятный шоколад , пасмурно , мельница для перца , редмонд , гладкость , на юг-стрит , начало , солнечно , роскошный кошелек , trontastic , ui-darkness , ui-lightness и vader .

• Сжатые темы: черный галстук , блицер , купертино , темный улей , точка-luv , баклажан , Excite-bike , Flick , hot-sneaks , человечество , le-frog , мятный шоколад , пасмурно , мельница для перца , редмонд , гладкость , юг-стрит , начало , солнечно , роскошный кошелек , trontastic , ui-darkness , ui-lightness и vader .

Answer 2

jQuery теперь имеет доступ к CDN:

code.jquery.com / ui / [версия] / themes / [название темы] / jquery-ui.css

---

И чтобы сделать это немного проще, вот, пожалуйста:

• база: http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css
• черный галстук: http://code.jquery.com/ui/1.9.1/themes/black-tie/jquery-ui.css
• блицер: http://code.jquery.com/ui/1.9.1/themes/blitzer/jquery-ui.css
• Купертино: http://code.jquery.com/ui/1.9.1/themes/cupertino/jquery-ui.css
• темный улей: http://code.jquery.com/ui/1.9.1/themes/dark-hive/jquery-ui.css
• dot-luv: http://code.jquery.com/ui/1.9.1/themes/dot-luv/jquery-ui.css
• баклажан: http://code.jquery.com/ui/1.9.1/themes/eggplant/jquery-ui.css
• Excite-байк: http://code.jquery.com/ui/1.9.1/themes/excite-bike/jquery-ui.css
• flick: http://code.jquery.com/ui/1.9.1/themes/flick/jquery-ui.css
• горячие пробки: http://code.jquery.com/ui/1.9.1/themes/hot-sneaks/jquery-ui.css
• человечество: http://code.jquery.com/ui/1.9.1/themes/humanity/jquery-ui.css
• le-frog: http://code.jquery.com/ui/1.9.1/themes/le-frog/jquery-ui.css
• мятный шоколад: http://code.jquery.com/ui/1.9.1/themes/mint-choc/jquery-ui.css
• пасмурно: http://code.jquery.com/ui/1.9.1/themes/overcast/jquery-ui.css
• Мельница для перца: http://code.jquery.com/ui/1.9.1/themes/pepper-grinder/jquery-ui.css
• Редмонд: http://code.jquery.com/ui/1.9.1/themes/redmond/jquery-ui.css
• гладкость: http://code.jquery.com/ui/1.9.1/themes/smoothness/jquery-ui.css
• Южная улица: http://code.jquery.com/ui/1.9.1/themes/south-street/jquery-ui.css
• начало: http://code.jquery.com/ui/1.9.1/themes/start/jquery-ui.css
• солнечно: http://code.jquery.com/ui/1.9.1/themes/sunny/jquery-ui.css
• шикарный кошелек: http://code.jquery.com/ui/1.9.1/themes/swanky-purse/jquery-ui.css
• trontastic: http://code.jquery.com/ui/1.9.1/themes/trontastic/jquery-ui.css
• UI-Darkness: http://code.jquery.com/ui/1.9.1/themes/ui-darkness/jquery-ui.css
• UI-легкость: http://code.jquery.com/ui/1.9.1/themes/ui-lightness/jquery-ui.css
• Вейдер: http://code.jquery.com/ui/1.9.1/themes/vader/jquery-ui.css

Answer 3

Google размещает jQueryUI css по этой ссылке https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery.ui.all.css

Если вы посмотрите на этот код напрямую, он импортирует CSS, используя @import , который может быть медленным . Вы можете разделить импорт на отдельные части, чтобы получить небольшой выигрыш в производительности:

https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery.ui.base.css https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery.ui.theme.css

Answer 4

Вы можете использовать это, если имеете в виду jQuery UI css:

<link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />

Answer 5

Я бы так подумал. Почему бы и нет? Не будет большой части CDN без предложения CSS для поддержки файлов сценариев

Эта ссылка предполагает, что они:

Нам особенно интересно, что CSS-темы jQuery UI теперь размещен на CDN библиотек Google Ajax.

Answer 6

Как Обама говорит: «Да, мы можем». Вот ссылка на него. developers.google.com / # JQuery

Вам нужно использовать

Google

ajax.googleapis.com/ajax/libs/jqueryui/[VERSION NO]/jquery-ui.min.js
ajax.googleapis.com/ajax/libs/jqueryui/[VERSION NO]/themes/[THEME NAME]/jquery-ui.min.css

jQuery CDN

code.jquery.com/ui/[VERSION NO]/jquery-ui.min.js
code.jquery.com/ui/[VERSION NO]/themes/[THEME NAME]/jquery-ui.min.css

Microsoft

ajax.aspnetcdn.com/ajax/jquery.ui/[VERSION NO]/jquery-ui.min.js
ajax.aspnetcdn.com/ajax/jquery.ui/[VERSION NO]/themes/[THEME NAME]/jquery-ui.min.css

Поиск названий тем здесь http://jqueryui.com/themeroller/ в подтаблике галереи

.

Но я бы не рекомендовал ваш хостинг от cdn по следующим причинам

1. Хотя ваш шанс попадания является хорошим в случае CDN Google по сравнению с другими, но он все еще крайне низок (любой CDN, не только Google).
2. При загрузке через cdn у вас будет 3 запроса: один для jQuery.js, один для jQueryUI.js и один для вашего кода. Вы можете сжимать его на локальном компьютере и загружать как единый ресурс.

http://zoompf.com/blog/2010/01/should-you-use-javascript-library-cdns