О блоге:

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

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

С информацией
Только заголовки

Фиксированное гамбургер-меню

Фиксированное гамбургер-меню на jQuery с анимированным появлением его элементов

Данное меню не рассчитано на большое количество пунктов, но отлично будет смотреться как навигационное на небольшом сайте или как вспомогательное.

Открытие и закрытие меню реализовано с использованием библиотеки jQuery

Читать далее

Простые решения по работе с сайтом и его элементами

Плейлисты для плеера Plyr

Создание простых плейлистов для медиаплеера Plyr

Медиаплеер Plyr — простой, легко настраиваемый и красивый плеер с массой настроек, событий и методов.

Данное решение на jQuery позволяет удобно добавлять неограниченное количество записей, которые будут воспроизведены в одном окне этого плеера.

Читать далее

Адаптивное мега-меню на jQuery

Очень простое, удобное и функциональное меню на jQuery

Преимуществом данного меню является то, что для отображения его выпадающих списков не используются CSS-классы .

Читать далее

Гамбургер иконки с анимированными переходами

7 разных вариантов перехода гамбургер иконки в крестик

«Гамбургер» — название иконки, состоящей из трёх параллельных горизонтальных линий, символизирующих список меню.

В данной заметке для такой иконки представлено 7 разных анимированных переходов в крестик по клику. Классы для гамбургера и крестика переключаются на jQuery

Читать далее

Плавное переключение радиокнопок

Плавное перемещение подсветки активной радиокнопки

Данное решение заменяет стандартные радиокнопки <input type="radio" /> обычными кнопками, а небольшой JS реализует плавный переход подсветки на активную.

Читать далее

Рисование цветов по движению мыши

Интересное решение на JS, рисующее линию цветов за курсором мыши

Данное решение будет более полезно для создания интересных композиций с цветами, нежели как элемент секции или блока на сайте.

Читать далее

Выдвигающееся описание для фотографий

Описание для фотографий, которое выдвигается сбоку при наведении курсора мыши

Обычно в галереях подписывают не фотографии, а только альбомы, и те не всегда. Для таких вариантов можно использовать оформление из темы "Hover-эффекты для изображений"

Но если требуется подписать именно каждую фотографию, то смотрим эту заметку

Читать далее

CSS курсоры

Наглядные примеры отображения курсоров мыши свойством cursor

CSS свойство cursor определяет курсор мыши, отображаемый при наведении указателя мыши на элемент.

Читать далее