Цей сайт призначений, в першу чергу тим, хто хоче зайнятися web-розробкою. Ви зможете ознайомитися з матеріалами по сайтобудування, починаючи від проектування дизайну, структури, і закінчуючи просуванням уже готових сайтів. Незабаром сайт повинен стати великою колекцією корисних матеріалів, рад, уроків, сервісів і посилань на допомогу як досвідченому web-розробнику, так і початківцям майстрам.
Почитати докладно про що цей блог
Незабаром в моєму блозі з'являться цикли статей «Створення сайту з нуля», «Робимо гнучкий, функціональний блог», «Інтернет-магазин на СMS / CMF MODx» і багато-багато іншого. Не перемикайтеся.
Стежити за появою нових статей на сайті. RSS стрічка.
Передмова
У кожного розробника завжди є два варіанти при реалізації певного функціоналу в проекті: писати з нуля або взяти готове рішення і перевірити його реалізацію на відповідність поставленим умовам. Якщо мова йде про дуже індивідуальному рішенні, то тут сумнівів не залишається - писати самостійно. Але в разі, якщо потрібно додати проекту фішку, яку ви вже десятки разів зустрічали на інших сайта, корисно буде спочатку поглянути на перелік готових рішень, перед тим як з головою занурюватися в винахід свого велосипеда.
Чому я, витративши досить багато часу на пошук, не знайшов його раніше? Відповідь проста: основне сховище подібних готових плагінів - plugins.jquery.com. перетворилося на якусь подобу звалища, куди розробники з усього світу скидають свої дітища, не завжди доведені до розуму. Пошук серед цього добра завжди займає багато часу, і при цьому я жодного разу (!) Не зміг знайти відповідне рішення за допомогою цього каталогу. Завжди для пошуку доводилося користуватися допомогою більш тямущих пошукових роботів Google і Yandex.
Минуло досить багато часу і з'явилася невелика проблема: так як практично всі записи блогу є «асорті» з плагінів, абсолютно різних за призначенням (це пов'язано з тим, що одночасно в мережі не з'являється відразу кілька рішень для реалізації одного певного функціоналу, тому мені доводилося об'єднувати абсолютно різні скрипти в одну замітку), то з кожною новою збіркою на блозі відвідувачам все важче було знайти необхідну рішення, порівняти його з іншими і вибрати відповідне.
Колекція плагінів і скриптів
Увага: всі посилання відкриються в новому вікні.
Акордеони і експандери
Розкриваються / закриваються блоки, які можуть містити в собі різний вміст. Ці блоки можна використовувати в навігації, в різних слайдерах або просто для приховування певних елементів на сторінці, які можна подивитися після натискання на посилання. Зустрічаються різні назви подібних плагінів, але найчастіше їх називають акордеони або експандери.
Виберіть і таби
Відмінні рішення для надання інформації на веб-сторінках у вигляді вкладок або так званих табів. Використання табів в веб-розробці може бути зумовлене різними причинами, наприклад, при необхідності розмістити більший обсяг інформацій на меншому просторі або для реалізації навігації на сайті. Крім того, що подібні вкладки допомагають веб-розробникам компактного розмістити інформацію на сторінці, вони також дозволяють додати цікавий ефект.
Спливаючі модальні і діалогові вікна
Модулі для реалізації спливаючих модальних і діалогових вікон за допомогою jQuery Mootools і CSS. Вікна виконані в різних стильових оформленнях.
Спливаючі опису для зображень
jQuery рішення для створення спливаючих назв і описів зображень при наведенні курсору миші. Описи з'являються з різними анімованими ефектами.
підказки
Підказки для відвідувачів сайту, що з'являються при наведенні курсору на елемент. Подібні рішення стали дуже популярні і все частіше використовуються на багатьох веб-сайтах. Завдяки спливаючих підказок у вас з'явиться можливість швидко роз'яснити новим відвідувачам призначення того чи іншого елемента на сторінці.
виїжджають панелі
Зумери, ефекти збільшення
Зображення та іншої медіа контент у спливаючих блоках
Каруселі, копіювальні та скролери
контактні форми
Цікаві стильні рішення для оформлення форм зворотного зв'язку на сайті з використанням CSS, jQuery і PHP: покрокові форми, форми з перевіркою правильності введення інформації «на льоту», спливаючі підказки при заповненні форм, форми з CSS3 анімованими ефектами, які виїжджають форми, форма в стилі Facebook і інші рішення.
Навігація: мега-меню
У замітці зібрані рішення для реалізації розгорнутої навігації по сайту. Випадають вертикальні і горизонтальні меню з величезною кількістю пунктів ідеально підійдуть для сайтів зі складною структурою або інтернет-магазинів. Крім пунктів в цих меню в випадає область можна помістити інший вміст, наприклад, зображення з описом.
Навігація: меню-акордеони
Рішення для реалізації навігації на сайті у вигляді роз'їжджаються меню, в так званому стилі акордеон: вертикальні і горизонтальні меню, що розкриваються після натискання або при наведення курсору, графічні меню, багаторівневі меню-акордеони та інші цікаві рішення.
Навігація: випадають і деревовидні меню
Навігація в вигляді випадають горизонтальних і вертикальних jQuery, Mootools, CSS меню: дворівневі, багаторівневі випадають меню, деревовидні меню в різному стильовому оформленні.
Навігація: анімовані меню
Оформлення кнопок, чекбоксів і інших елементів інтерфейсу
Рішення для потрясного оформлення елементів призначеного для користувача інтерфейсу: кнопки, чекбокси, радиокнопки, оформлення форм.
плаваючі блоки
При прокручуванні екрану ці блоки завжди підтягуються в поле зору відвідувача. Ідеально підійдуть для відображення, наприклад, меню на сайті або кошика замовлень в інтернет-магазині.
Слайдери і слайд-шоу
Колекція jQuery Mootools CSS плагінів і скриптів для реалізації цікавих слайдеров зображень і слайд-шоу на ваших сайтах: з автоматичної і ручної зміною слайдів, з текстовим описом слайдів і без нього, слайдери фонових зображень, зі слайдами і без них, кругові Сладера, 3D слайдери, величезна кількість найрізноманітніших анімованих ефектів переходу між зображеннями.
текстові ефекти
Різні текстові ефекти: градієнти, розмір тексту, ефекти при наведенні, розмиття, світіння, переливання, відображення та інші прийоми.
Фільтри інформаційних блоків
фонові ефекти
Модулі для реалізації фонових ефектів: масштабовані фонові зображення, ефект руху фонових шарів, hover-ефект.
Hover-ефекти, ефекти при наведенні
Кілька цікавих hover-ефектів (ефекти при наведенні курсору) з використанням jQuery: зміна зображень і анімовані ефекти.
анімовані ефекти
Рішення для реалізації різної анімації на веб-сторінках з використанням jQuery.
На все добре, Єфімов Віктор.