Твит

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

Твит

Возможно вы видели такие плагины для браузеров, которые позволяют не просто показывать страницу статично, но и добавлять некоторые эффекты. Например, одним из таких эффектов является «отскок» страницы, как на iOS/Android. В браузере Mozilla Firefox это можно сделать с помощью плагина Yet Another Smooth Scrolling. Но большинство пользователей даже не знают о нем, поэтому можно сделать данный эффект у себя на сайте с помощью библотеки FancyScroll.js.

Твит

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

Твит

Существует огромное множество различных меню: горизонтальных, вертикальных и круговых, выдвигающихся, появляющихся и тех, которые видны сразу при загрузке на сайте. Каждый выбирает для своего сайта то, которое больше нравится и подходит по дизайну. Я также опубликовал уже немало уроков о том как создать то или иное меню. Выбор делать конечно вам. А в этом уроке мы создадим меню в стиле Youtube. Реальный пример можно увидеть на сайте.

Твит

Сегодня мы рассмотрим как создать меню как в Google Nexus 7. Меню будет появляться слева при наведении на переключатель. Изначально будут видны лишь иконки пунктов меню, но при наведении на любой из пунктов будет появляться текстовая часть каждого элемента меню. Для создания данного меню будет использован неупорядоченный список, вложенный список, а также некоторые CSS переходы. А также чтобы меню правильно смотрелось на маленьких экранах зададим специальные свойства media-queries.

Твит

Все стремятся создать сайт что он правильно смотрелся на разных экранах(от маленьких разрешений 320х480 до 1920х1900, хотя они могут быть меньше и больше как в одну так и в другую сторону). И в этом уроке мы рассмотрим как создать адаптивное меню, которое будет правильно смотреться на разных устройствах. А это очень важно для пользователя, который просматривает ваш сайт с мобильного устройства.
Реальный пример можно увидеть на сайте.

Твит

Дорогие подписчики и посетители моего сайта. Скоро Новый Год, и в связи с этим хочу поздравить вас в этом небольшом видео, а также пожелать всего самого наилучшего в наступающем году!
Мы пережили непростой год Змеи, теперь можно расслабиться, шутить и веселиться :) Предпраздничная суета, сувениры и презенты куплены. Конечно же, самым популярным подарком в этом году будут фигурки лошади: гипсовые, деревянные, фарфоровые, из металла и пр. От самых крошечных статуэток до внушительных композиций. А еще будут дарить подковы, колокольчики и бубенцы. Словом все, связанное с лошадиной тематикой.

Твит

Может вы уже видели новый дизайн Airbnb iOS 7? Они сделали просто потрясающую анимацию для меню. И, что что действительно поражает, данную анимацию воссоздали с помощью javascript. Был написан плагин, который называется Fly Side Menu. Fly side menu позволяет трансформировать всю страницу и смещать ее влево, вправо, вверх или вниз, чтобы с противоположной стороны разместить меню.
Подключите обязательно последнюю jQuery библиотеку.

Твит

Потрясающий плагин, с помощью которого можно создавать 3D кубики для разных целей. Например, в данном уроке с помощью этого плагина мы создадим 3D часы, которые можно настраивать просто поворачивая кубики мышкой. До Нового Года осталось совсем немного, но можно сделать отсчет используя кубики.
Библиотеке HexaFlip создает свою разметку, а вам необходимо лишь добавить на страницу сайта и прописать стили для кубиков или переопределить уже имеющиеся.

Твит

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

Твит

При работе со свойствами 3D трансформации можно заметить что не имеют никакой тени и можно подумать что они плоские. Для эффекта объема можно задать зеркальное отражение или тень. А также при наведении курсора мыши изображение будет «поворачиваться» но не полностью. Мы не будем использовать javascript код чтобы создать данный эффект, а воспользуемся лишь возможностями CSS3.
Нам необходимо расположить на странице несколько частей постера: переднюю часть, в виде основного изображения, и часть, которая появляется при наведении, она будет с изображением и текстом.