Laravel 
React 
Vue 
Next.js 
Nuxt.js 
Opencart 
Worpress 
PHP 
Час рухається вперед та у сфері розробки сайтів з’являються нові технології. Зокрема, великий галас робить популярний css3 зі своїми можливостями анімації. Все ж таки друзі погодьтеся, jQuery як і раніше рулить у плані різноманітності анімації та захоплюючих спецефектів.
jQuery – це сучасна бібліотека скриптів, що базуються на базі прогресивної мови програмування JavaScript, для реалізації найрізноманітніших завдань у процесі створення сайтів. Бібліотека допомагає оформляти зовнішній вигляд сайту, приховує блоки контенту, фіксує банери, зачаровує ефектами анімації, бере участь у перевірці форм, взаємодіє з AJAX. Способів застосування безліч.
Нещодавно довелося робити для зображень ефект flip. Картинка перевертається плавно у горизонтальній, або вертикальній площині. При мінімальному дотику миші починає показуватися її зворотний бік. Насправді ефект здійснюється за допомогою двох картинок. Хоча виникає відчуття, що картинка одна. Такий варіант легко реалізувати застосовуючи CSS3. Але там ефект надто обмежений. У jquery ми всі чеканемо до ідеальності. В результаті виходить все реалістично та красиво.
Щоб використовувати скрипти jquery на блозі, слід підключити цю бібліотеку. Способів підключення є кілька. Розглянемо найактуальніші.
Підключення джейквері через Google. Часто використовуваний варіант новачками. Потребує мінімум знань у програмуванні. Вводимо між тегами такий вид коду:
[code lang="js"]
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
[/code]Тепер через Google бібліотека підвантажуватиметься автоматично. Для економії часу копіюєте рядок та підставляєте цифри свіжої версії. Останню версію дізнаємося тут JQuery.
Додаткові DNS для з’єднання. Нижче наведено ще два варіанти онлайн підключення. Особисто я підключаюся через Google і вам раджу.
[code lang="js"]
http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.12.0.min.js
[/code][code lang="js"]
http://code.jquery.com/jquery-1.12.0.js
[/code]Всі представлені посилання працюють, коли сайт безпосередньо взаємодіє з інтернетом. Найчастіше сайти розробляються на локальному сервері localhost. Насправді хостингом є наш комп’ютер. І якщо з’єднання з інтернетом відсутнє, отже скрипти перестануть працювати.
Проблема вирішується попереднім завантаженням бібліотеки jquery та розміщенням її файлів у спеціальній папці під назвою js (називаємо папку самі). Зазвичай папка ява скриптів знаходиться у шаблоні движка cms. У простих html сайтах в корені.
Підключення для html сайту:
[php]
<script src="jquery.min.js"></script>
[/php]Підключення для Joomla:
[php]
/* Використовуємо конструктор об'єктів для отримання інших методів
класів. Отримуємо об'єкт класу JDocumentHTML.
Іншими словами ми створили об'єкт */
$doc = JFactory::getDocument();
$doc->addScript(JUri::base().'templates/'.$doc->template.'/js/jquery.min.js');
/* Призначаємо шлях до файлу */
[/php]Як дізнатися, чи підключилася бібліотека
Працюючи з кодом, завжди необхідно уважно стежити за розташуванням скриптів. Іноді скрипт може не запрацювати. Шукаєш причину неполадки і потім, коли знаходиш, виявляється проблема в елементарному – пропустили якісь літери, слеш, не правильно скопіювали рядок. Тому після підключення перевіряйте працездатність.
[js]
<!DOCTYPE html>
<html lang="ru">
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
/* Нижче ініціалізуємо скрипт,
який виведе повідомлення на екран
у разі вдалого підключення */
<script>
$(function()
{
alert('Вітаємо! Ви вдало підключили jQuery');
});
</script>
</head>
<body>
</body>
</html>
[/js]Можливості jQuery справді значні. І буде великим плюсом навчитися самостійно створювати власні скрипти.
Залишити відповідь