Новинки от ruseller.com

Автоматическая нумерация изображения с помощью CSS счётчиков

smart.noreply@gmail.com

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

Определение доступности атрибута HTML5 с помощью JavaScript

smart.noreply@gmail.com

Сегодня мы посмотрим как можно организовать проверку доступности атрибута HTML5 с помощью JavaScript. Проверять будем работу элементов details и summary.

Стартуем с Ember.js: следующий шаг

smart.noreply@gmail.com

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

23 примера сайтов с “плоским” дизайном

smart.noreply@gmail.com

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

Применяем CSS в зависимости от ориентации экрана

smart.noreply@gmail.com

С появлением в CSS3 медиа запросов у нас появилась возможность применять CSS в зависимости от ориентации экрана пользователя.

ВИДЕО: Используем Google Fonts с умом

smart.noreply@gmail.com

Сегодня мы поговорим о сервисе Google Fonts, который позволяет внедрить на ваш сайт красивые шрифты.

Полно-экранное приложение с переходам между страницами

smart.noreply@gmail.com

Сегодня мы посмотрим на реализацию адаптивного полноэкранного дизайна. Переход по каждому из разделов (псевдо-страницам) сопровождается плавной анимацией.

Отображение времени публикации материала как в соц сетях (минут/часов/дней назад)

smart.noreply@gmail.com

Доброго времени суток! Сегодня я бы хотел поделиться одним очень интересным jQuery плагином, который предназначен для преобразования даты в человеко-понятный и приятный формат. Наверняка в соц сетях вы видели подобный принцип: создал запись, время публикации: “минуту назад”... и.д.

ВИДЕО: Организуем поиск записей сразу по нескольким таблицам

smart.noreply@gmail.com

Сегодня мы посмотрим возможное решение следующей задачи: выборку информации из БД сразу по нескольким таблица (где количество и названия полей совпадает и нет).

HTTP: протокол, который каждый разработчик должен знать (часть 1)

smart.noreply@gmail.com

HTTP - это протокол передачи гипертекста между распределёнными системами. По сути, http является фундаментальным элементом современного Web-а. Как уважающие себя веб разработчики, мы должны знать о нём как можно больше.

15 действительно креативных страниц ошибки 404

smart.noreply@gmail.com

Думаете об оригинальном оформлении страниц, когда пользователь забрёл куда-то не туда? Сегодня мы посмотрим на несколько действительно классных примеров оформления страниц ошибки 404.

Галерея приложения на мобильном устройстве

smart.noreply@gmail.com

Сегодня мы создадим небольшое приложение с красивым эффектом. Идея такова: изначально мы показываем мобильный телефон со скрином приложения. При клике по телефону будет раскрываться небольшая галерея с остальными возможными скриншотами. При выборе скрина, его изображения совмещается с мобильным телефоном, а все остальные исчезают.

Пару слов о генерации случайных чисел в PHP

smart.noreply@gmail.com

В этой статье мы поговорим о случайных числах: как они генерируются и где их можно задействовать.

Стартуем с Ember.js (Часть 1)

smart.noreply@gmail.com

На данный момент существует огромное множество JavaScript библиотек, предназначенных для манипулирования DOM-ом. Однако когда речь заходит о необходимости построения одно-страничного приложения, многие фрэймворки сдуваются.

Поговорим о специфике работы CSS

smart.noreply@gmail.com

Если вы часто используете CSS, то наверняка вам будет полезно знать о специфике его работы. Настоящий мастер в первую очередь должен знать именно это, а потом уже как позиционировать и оформлять элементы. Так же, если вы когда-то использовали ключевое слово important!, то эта статья так же для вас.

ВИДЕО: Создаём собственную визуальную капчу

smart.noreply@gmail.com

Для того чтобы защититься от спам ботов была изобретена текстовая капча. Однако всё чаще и чаще мы видим другие виды капч, где нужно решить какое-то уравнение или выбрать фото. Сегодня попробуем создать такую капчу.

Вдохновляющие сайты Android приложений

smart.noreply@gmail.com

На прошлой неделе мы рассмотрели 21 пример сайтов, презентующих приложения для iPhone. Сегодня мы продолжим эту тему и посмотрим на сайты Android приложений.

Делаем боковое меню как на YouTube

smart.noreply@gmail.com

Сегодня мы посмотрим на то, как можно создать боковое меню как на YouTube при просмотре видео. Идея заключается в раскрытии меню после нажатия на специальную иконку.

Легковесный jQuery плагин для перемотки страницы "Наверх"!

smart.noreply@gmail.com

ScrollUp - это простой и лёгкий jQuery плагин, с помощью которого мы сможем внедрить кнопку, при нажатии на которую пользователь плавно отправится на начало страницы.

Знакомство с knockout.js (часть 3/3)

smart.noreply@gmail.com

В заключительной части знакомства с knockout.js мы добавим ещё несколько фишек к тому, что делали в предыдущих двух уроках. Мы уже разобрали фундаментальные основы библиотеки: привязку данных, шаблонизатор, наблюдателей и так далее. В этом уроке, мы закрепим наши знания.

Создаём видео плеер для нашего сайта

smart.noreply@gmail.com

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

ВИДЕО: Создание анимации загрузки при ajax запросах

smart.noreply@gmail.com

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

Функциональное программирование и PHP

smart.noreply@gmail.com

Сегодня многие говорят о функциональном программировании, но не каждый сможет с уверенностью сказать, что следовал всем принципам данного способа написания программ. Главной причиной этому является наше однонаправленное мышление и обыкновенное незнание. В этой статье мы разберём основные принципы функционального программирования на PHP.

21 пример красивых сайтов приложений для iPhone

smart.noreply@gmail.com

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

ВИДЕО: Автоматическая подгрузка контента при прокручивании страницы

smart.noreply@gmail.com

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

Как использовать атрибут download

smart.noreply@gmail.com

HTML5 очень сильно отличается от предыдущих версий: в нём появилось множество новых элементов и атрибутов. Сегодня мы поговорим об атрибуте download.

Анимируем профильные карточки с помощью CSS

smart.noreply@gmail.com

Сегодня мы рассмотрим как можно применить CSS анимацию в действии. В данном примере будем использовать несколько эффектов. Просто наводим мышь на изображением и видим эффект.

Генерируем одноразовые ссылки

smart.noreply@gmail.com

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

Многоуровневое адаптивное меню

smart.noreply@gmail.com

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

ВИДЕО: Улучшаем производительность сайта

smart.noreply@gmail.com

В этом уроке мы рассмотрим три инструмента, которые помогут нам сжать изображения, js скрипты и css файлы. Благодаря этим действиям, мы сможем значительно уменьшить время загрузки перечисленных ресурсов.

Считаем количество параграфов, слов и символов с помощью Countable.js

smart.noreply@gmail.com

Сегодня мы рассмотрим JavaScript плагин для подсчёта количества параграфов, слов и символов.

Как использовать Google+ для увеличения поискового трафика

smart.noreply@gmail.com

Через полтора года после официального релиза Google+ стало абсолютно очевидно его влияние на результаты поиска. Начиная с этого момента, количество трафика от знаменитой поисковой системы Google зависит не только от традиционных приёмов SEO.

Вышел jQuery 2.0

smart.noreply@gmail.com

Да, да! Всё верно! Буквально несколько часов назад состоялся релиз новой версии одной из самых любимых библиотек - jQuery 2.0.

Используем HTML5 Full-Screen API

smart.noreply@gmail.com

HTML5 состоит из множества отдельных компонентов, сопровождённых специальными API. Среди них и Fullscreen API, который позволяет сделать то, что раньше мог только Flash: отобразить приложение в полно-экранном режиме.

Знакомство с knockout.js (часть 2/3)

smart.noreply@gmail.com

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

5 инструментов создания favicon

smart.noreply@gmail.com

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

MongoDB для начинающих: основные команды (часть 3/3)

smart.noreply@gmail.com

В сегодняшнем уроке мы настроим нашу систему таким образом, чтобы мы могли работать с MongoDB через PHP.

Проблемы CSS оформления в элементах форм

smart.noreply@gmail.com

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

Простой способ создания боковых меню с плагином Sidr

smart.noreply@gmail.com

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

Знакомство с knockout.js (часть 1/3)

smart.noreply@gmail.com

В этом уроке мы создадим пользовательский интерфейс, содержащий список контактов, который мы в последствии сможем фильтровать и сортировать. Knockout.js будет играть роль посредника между данными и страницей, таким образом, облегчив нам работу над UI.

20 классных контактных страниц

smart.noreply@gmail.com

Главная цель любого сайта - заинтересовать пользователей в том, что вы предлагаете. Будь то какой-то конечный продукт или услуга, 9 человек из 10 захотят связаться с вами. Именно поэтому вам нужно будет создать контактную страницу.

CSS трансформации и анимация

smart.noreply@gmail.com

В этом уроке, мы рассмотрим способы создания анимации средствами CSS.

jQuery Mobile: Темы

smart.noreply@gmail.com

В этой статье мы рассмотрим несколько стандартных тем, которые сделают ваше приложение более похожим на iOS, Android или Windows Phone, а так же разберём процесс создания собственной темы для jQuery Mobile.

MongoDB для начинающих: основные команды (часть 2/3)

smart.noreply@gmail.com

Сегодня мы продолжим разговор о СУБД MongoDB. В этом уроке вас ждёт знакомство с основными командами для работы с БД через командную строку.

Решаем проблемы навигации на крупных сайтах

smart.noreply@gmail.com

На большинстве сайтов навигация выглядит примерно так: основная панель с поддержкой под-навигации. Правда, существуют такие сайты, где обычной системы навигации не хватает. Сегодня мы рассмотрим подобные проблемы и способы их решения.

JavaScript селекторы

smart.noreply@gmail.com

Многие разработчики настолько часто начали пользоваться jQuery, что даже не заметили кардинальных изменений в самом JavaScript. Об этом мы и поговорим.

Сетка миниатюр с возможностью расширенного представления

smart.noreply@gmail.com

В последнее время поиск изображений через Google несколько преобразился. Сегодня мы рассмотрим, каким образом можно организовать подобный функционал. Идея заключается в отображении более крупного изображения при клике на его миниатюру, а также вывод названия, описания и ссылки.

Бесплатные уроки по инструменту Chrome Developers Tool

smart.noreply@gmail.com

Chrome Developers Tool - это очень полезный инструмент, особенно когда дело касается отладки веб сайтов. Бьюсь об заклад, что все, кто пользуется данным инструментом действуют в большей степени интуитивно, однако для новичков хороший обучающий материал был бы очень полезен.

MongoDB для начинающих: знакомство и установка (часть 1/3)

smart.noreply@gmail.com

MongoDB - это система управления базами данных, которая значительно отличается от MySQL. Основная разница заключается в том, что в MySQL запросы пишутся на языке SQL, а в MongoDB на BSON (бинарный JSON). Это значит, что работа с этой системой может осуществляться в основном через JavaScript выражения.

Прощаемся с Zen Coding. Встречаем Emmet

smart.noreply@gmail.com

В 2009 году Сергей Чикуёнок опубликовал статью, которая изменила представление о написании HTML и CSS кода. За эти годы огромное число разработчиков стали пользоваться плагином Zen Coding, развитие которого выходит на новый уровень.

Специально к 1 апреля: fool.js

smart.noreply@gmail.com

Сегодня первое апреля, день смеха! Я уверен, что большинство сайтов опубликуют “специальные” новости или просто забавный материал. Как же можно разыграть своих пользователей в этот день? Ответ прост: fool.js

11 фаз карьеры веб разработчика

smart.noreply@gmail.com

Сегодня многие люди стремятся стать веб разработчиками. В данной профессии есть множество подводных камней: вас ждут взлёты и падения... периоды затишья. В этой шуточной статье мы пройдёмся по каждому этапу развития веб разработчика.

Советы по дизайну оплаты товаров для мобилок

smart.noreply@gmail.com

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

PHP и MVC (часть 2)

smart.noreply@gmail.com

В этом уроке мы продолжим говорить о MVC и затронем некоторые сторонние аспекты, нужные нам при использовании данного шаблона.

Супер гибкий плагин для создания чекбоксов и радио кнопок

smart.noreply@gmail.com

Сегодня мы познакомимся с плагином iCheck, которой позволяет красиво оформить чекбоксы и радио кнопки.

Интервью с ведущим разработчиком jQuery Дэйвом Метвином

smart.noreply@gmail.com

Многие из нас знакомы с JavaScript фрэймворком jQuery. Более того, мы довольно-таки часто используем его в наших проектах. Ну а что мы знаем о самих людях, которые тратят своё время на развитие самой популярной JavaScript библиотеки. Дэйв Метвин является соавтором, а также главой фонда jQuery. Мы обсудили его деятельность и видение развития фронт-энд разработки.

Создание аутентификации через социальные сети на вашем сайте

smart.noreply@gmail.com

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

Принципы написания чистого CSS кода

smart.noreply@gmail.com

В этом уроке мы посмотрим как оптимизировать CSS код и делать его более эффективным.

8 jQuery плагинов для улучшения интерфейса

smart.noreply@gmail.com

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

Реализуем инструмент для выбора цвета на HTML5 Canvas

smart.noreply@gmail.com

В этом уроке мы воспользуемся новым элементом Canvas, который был введён в HTML5, и создадим с его помощью инструмент для выбора цвета.

Аутентификация через Facebook

smart.noreply@gmail.com

Привет всем! Сегодня мы выходим на финишную прямую и рассмотрим, как осуществить процесс аутентификации через социальную сеть Facebook.

Работаем с Bootstrap плагином: Модальные Окна

smart.noreply@gmail.com

Сегодня мы продолжим разговор о Bootstrap. В этом уроке посмотрим принцип работы с плагином создания модальных окон.

Аутентификация через Google

smart.noreply@gmail.com

Приветствую Вас, пользователи руселлера! Сегодня мы сделаем ещё один шаг на пути реализации аутентификации через социальные сети. На этот раз возьмёмся за Google.

MVC и PHP (Часть 1)

smart.noreply@gmail.com

В этой статье мы поговорим о принципах работы MVC, определимся с правилами работы данного шаблона и посмотрим на простую реализацию MVC на PHP. Если вы впервые слышите о данном понятии, то вам будет интересно.

Аутентификация через Yandex

smart.noreply@gmail.com

Сегодня мы продолжим разговор, посвящённый созданию аутентификации пользователей через социальные сети и сервисы. На этот раз под наш прицел попадает Yandex.

В поисках генераторов текстового и графического контента

smart.noreply@gmail.com

Хоть популярность Lorem Ipsum и является неоспоримой, возможности данного сервиса ограничены в том случае, если нам необходимо создать макет профиля или заполнить базу данных какими-то случайными значениями для тестирования: именами пользователей, аватарами нужного размера и так далее... Для этого можно воспользоваться и другими сайтами.

Реляционные базы данных для чайников

smart.noreply@gmail.com

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

Аутентификация через Mail.ru

smart.noreply@gmail.com

Продолжаем цикл статей, посвящённых созданию аутентификации пользователей через социальные сети и сервисы. Сегодня посмотрим, как осуществить подобный функционал через сервис Mail.ru

Стартуем с Twitter Bootstrap

smart.noreply@gmail.com

В этой статье мы познакомимся с Bootstrap и попробуем на практике некоторые компоненты, для того чтобы убедиться, что данный фрэймворк действительно упрощает работу над созданием сайта.

Аутентификация через Одноклассники

smart.noreply@gmail.com

Сегодня мы продолжим разговор о том, как создать аутентификацию ваших пользователей через социальные сети и сервисы. На этот раз возьмёмся за "Одноклассники"!

Анимация загрузки, как на Facebook

smart.noreply@gmail.com

Сегодня мы рассмотрим, каким образом с помощью CSS3 можно создать анимацию загрузки, как на Facebook.

Аутентификация через ВКонтакте

smart.noreply@gmail.com

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

Адаптивное меню на CSS3

smart.noreply@gmail.com

Сегодня мы поговорим о том, как создать адаптивное меню, используя только CSS3. Почему именно адаптивное? Мне кажется, это очень важно и должно стать нормой, ведь уже сегодня огромное число людей заходят в интернет через мобильные девайсы (ipad-ы, iphone-ы...). Этим пользователям необходимо дать возможность удобной навигации по вашему сайту. Для решения данной задачи можно воспользоваться jQuery или JavaScript-ом, но сегодня мы рассмотрим нечто иное.

Применяем продвинутые техники для улучшения вашего JavaScript кода

smart.noreply@gmail.com

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

Стилизуем чекбоксы и радиокнопки с CSS3

smart.noreply@gmail.com

Благодаря CSS3, мы можем добиться практически любого нужного нам на экране эффекта. В этом уроке рассмотрим, каким образом можем стилизовать чекбоксы и радио кнопки.

Основы построения асинхронных приложений

smart.noreply@gmail.com

Одна из сильных сторон JavaScript - обработка асинхронного кода. Вместо того, чтобы блокировать поток выполнения задачи, асинхронный код выстраивает события в очередь, которая выполняется после завершения других частей программы.

Создаём аудиоплеер для нашего сайта

smart.noreply@gmail.com

Сегодня мы займёмся созданием собственного веб аудио плеера. Если вы занимаетесь подкастингом и хотите создать плеер, который будет вписываться в дизайн вашего сайта, этот урок специально для вас.

PHP и Twig: создание шаблонов веб страниц

smart.noreply@gmail.com

Сегодня мы более детально представим возможности шаблонизатора Twig.

Авто-заполнение с Twitter Typeahead.js

smart.noreply@gmail.com

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

Что нового в jQuery Mobile 1.3

smart.noreply@gmail.com

jQuery Mobile - это удобный JavaScript фрэймворк, который облегчает работу над созданием мобильных веб-приложений и сайтов, адаптированных под мобильные устройства. На прошлой неделе вышел jQuery Mobile 1.3. По сравнению с версией 1.2, нас ждёт большое количество усовершенствований и новых фишек. В этой статье вы узнаете о самых важных изменениях, и узнаете, как использовать jQuery Mobile 1.3, для того чтобы улучшить ваши сайты и веб-приложения.

Индикатор прогресса HTML5

smart.noreply@gmail.com

В HTML5 появился элемент индикатора прогресса, который выводит состояние процесса выполнения определенных задач, например, таких как загрузка данных на сервер.

Обработчик шаблонов Twig. Быстрый старт.

smart.noreply@gmail.com

На сегодняшний день существует большое количество способов осуществить вывод на html страницу. Всё чаще и чаще для этих целей веб разработчики пользуются так называемыми шаблонизаторами. Сегодня мы рассмотрим небольшой пример использования шаблонизатора Twig.

Проверка работоспособности вашего сайта на PHP

smart.noreply@gmail.com

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

8 способов защитить ваше веб приложение

smart.noreply@gmail.com

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

Эффект отскока на анимации CSS3

smart.noreply@gmail.com

В данном уроке мы создадим визуальный эффект с помощью анимаций CSS3. В итоге должна получиться информационная панель, которая появляется с "отскоком".

Простое и эффектное выпадающее меню на jQuery и CSS3

smart.noreply@gmail.com

В данном уроке мы построим простое выпадающее меню с использованием jQuery. Оно будет работать с помощью метода анимации для генерирования задержанных эффектов. Вместе с кодом JavaScript также применяются эффекты переходов CSS3. В результате получается заготовка для навигации сайта.

Галерея изображений в стиле картотеки ролодекс

smart.noreply@gmail.com

Картотека ролодекс достаточно долгое время (с 50-х до середины 80-х прошлого века) была популярным атрибутом рабочего пространства. Удобная конструкция размещения карточек на барабане обеспечивала быстрый доступ к нужной информации. Сделаем галерею изображений в стиле популярного офисного прибора.

Разные блоки с разных направлений

smart.noreply@gmail.com

В данном уроке мы сделаем эффект вывода различных информационных блоков при наведении курсора мыши на изображение с разных сторон. Для реализации решения будет использоваться только CSS.

Контекстное меню в браузере средствами HTML5

smart.noreply@gmail.com

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

Поcледовательный вывод элементов на CSS и jQuery

smart.noreply@gmail.com

Парадокс, но вывод элементов с задержкой последовательно один за другим ускоряет процесс восприятия информации: у посетителя складывается ощущение интерактивного плавного взаимодействия с содержанием страницы.

Используем презентацию Google Docs на своем сайте

smart.noreply@gmail.com

Google Docs - онлайн инструмент, разработанный "корпорацией добра", содержит редко используемый сервис - полноценное приложение для создания презентаций. Как и все разработанное Google, презентации основаны на HTML5 и могут встраиваться в любой веб сайт. Они также поддерживают переходы и эффекты, которые являются обычным явлением в Powerpoint, но все реализовано на CSS3. Такие характеристики превращают презентации Google Docs в отличный инструмент для представления продукта!

Аккордеон в стиле Metro

smart.noreply@gmail.com

В данном уроке мы сделаем аккордеон в стиле Metro. Меню будет использовать jQuery и jQueryUI.

WordPress: пользовательская страница для ошибки базы данных

smart.noreply@gmail.com

Если вы пользователь WordPress, то, вероятно, уже сталкивались с мало известной ошибкой “Error establishing a database connection” (Ошибка соединения с базой данных). Такая ошибка появляется, когда возникают проблемы с обработкой запроса. У некоторых хостеров, экономящих на качестве обслуживания, такая ситуация складывается частенько. Рассмотрим, как можно сделать страницу для данной ошибки в едином стиле проекта.

Эффекты для изображений в браузерах webkit

smart.noreply@gmail.com

В данном уроке мы рассмотрим интересную особенность браузеров webkit – анимацию масок изображений. Эффекты работают только в браузерах webkit (Chrome и Safari). В основе реализации лежат маски изображений, которые действуют по тому же принципу, что и в Photoshop.

WordPress: короткий код для простой интеграции Google Maps

smart.noreply@gmail.com

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

Лента с использованием только CSS

smart.noreply@gmail.com

Сделаем популярный элемент, использующийся в оформлении страниц веб проектов - ленту с текстом. Для решения задачи потребуется только один HTML элемент и CSS. Никаких изображений и JavaScript.

Складывающийся 3D список

smart.noreply@gmail.com

3D трансформации CSS - чудесный инструмент. С их помощью можно создавать удивительные эффекты. Какая идея будет реализована в данном уроке? Допустим, у вас есть блог, а внизу записи располагается эффектный складывающийся 3D список кнопок различных социальных сетей, и когда читатель прокручивает страницу вниз до конца список плавно раскрывается. Отличный способ для привлечения внимания.

Меню с эффектом "лава-лампа" на CSS

smart.noreply@gmail.com

В данном уроке мы создадим эффект для меню, известный как "лава-лампа", с использованием только CSS.

Диагональная галерея миниатюр

smart.noreply@gmail.com

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

Круглое переворачивающееся слайдшоу

smart.noreply@gmail.com

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

Фиксированная навигация с использованием плагина jQuery Waypoints

smart.noreply@gmail.com

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

Реальное применение свойства clip для формирования визуального эффекта

smart.noreply@gmail.com

В предыдущем уроке мы рассказали о замечательном свойстве CSS clip и функции rect(). Теперь рассмотрим практическое применение описанного свойства. Создадим прелестный и простой эффект для скрытия части содержания и вывода его полностью на весь экран.

Рассмотрим подробно свойство clip

smart.noreply@gmail.com

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

WordPress: автоматическое генерирование QR кода для записи или страницы

smart.noreply@gmail.com

QR коды достаточно популярны в наше время. У вас есть желание генерировать QR коды для всех записей в блоге? Есть простой способ для автоматизации данной задачи.

WordPress: добавляем сообщение на страницу регистрации

smart.noreply@gmail.com

Если вам нужно вывести сообщение на странице регистрации, то есть достаточно простое решение.

3D галерея в комнате

smart.noreply@gmail.com

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

WordPress: скрываем почтовые адреса от спамботов

smart.noreply@gmail.com

Спамботы являются большой проблемой для блогов и веб сайтов. Но можно и для них создать трудности. автоматически скрывая почтовые адреса.1_8

WordPress: автоматическое добавление атрибута "nofollow" для внешних ссылок

smart.noreply@gmail.com

По умолчанию WordPress не добавляет автоматически атрибут rel=”nofollow” к внешним ссылкам в содержании записи. Но такое положение легко исправить.

Бриллиантовая модульная сетка

smart.noreply@gmail.com

С постоянно продолжающейся адаптацией CSS3 в браузерах, мы получаем возможность решать все больше и больше задач только средствами CSS. Так, можно создавать любые геометрические формы с помощью набора CSS правил. А теперь продвинемся дальше и построим необычную модульную сетку.

10+ вставок кода для htaccess

smart.noreply@gmail.com

Файл .htaccess — один из тех файлов, которые должен быть известен и понятен каждому администратору веб сайта. На базовом уровне он управляет доступом к папкам сайта. Но есть еще много задач, которые htaccess может решить для вас.

Адаптивное анимированное меню на CSS и jQuery

smart.noreply@gmail.com

В данном уроке мы сделаем простое навигационное меню с анимационным эффектом при наведении курсора мыши.

SVG: вывод в неподдерживающих его браузерах

smart.noreply@gmail.com

В предыдущих уроках серии мы разбирались с основами использования SVG в веб проектах. Однако, в старых браузерах данный интересный элемент имеет ряд проблем. Пришла пора разобраться с методами решения задачи совместимости кода.

Wordpress: постоянное перенаправление на серверную часть.

smart.noreply@gmail.com

Может показаться странным, но в некоторых проектах требуется только серверная часть Wordpress. Простым действием можно организовать постоянное перенаправление всей клиентской части к форме wp-admin/login.

Простой слайдер для нескольких пунктов

smart.noreply@gmail.com

В данном уроке мы сделаем простой слайдер для пунктов списка на основе анимаций CSS и jQuery. Идея для урока инспирирована слайдером продукции Apple, где несколько товаров выскальзывают с использованием анимации. Мы трансформируем данную концепцию для онлайн магазина, чтобы представлять товары в разных категориях. Категории с небольшим количеством товаров отлично подходят к данному слайдеру.

Метатеги и SEO

smart.noreply@gmail.com

Много заблуждений кроется в вопросе влияния метатегов на SEO. Некоторые теги очень часто использовались в прошлом, но уже потеряли свою силу. Так какие же теги все еще пригодны для SEO, а какие нет?

SVG: анимация

smart.noreply@gmail.com

В предыдущих уроках серии мы разбирались использованием векторной графики SVG в HTML. Теперь пришел черед рассмотреть анимацию SVG.

Адрес URL, подходящий для SEO

smart.noreply@gmail.com

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

Большое меню, маленький экран: адаптивная многоуровневая навигация

smart.noreply@gmail.com

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

SVG: текст в векторной графике

smart.noreply@gmail.com

В предыдущих уроках серии мы рассмотрели основы работы с SVG в HTML. Данный урок будет посвящен использованию текста в векторной графике.

SVG: используем CSS для определения внешнего вида

smart.noreply@gmail.com

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

Концепция постраничной навигации

smart.noreply@gmail.com

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

Приложение для Android: управление файлами в разных облачных хранилищах

smart.noreply@gmail.com

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

SVG: основы векторной графики в HTML

smart.noreply@gmail.com

Векторная графика широко используется в печатном деле. Но и для веб сайтов мы можем использовать её с помощью SVG (Scalable Vector Graphic - масштабируемая векторная графика).

Строим свою CMS на PHP и MySQL. Часть 9

smart.noreply@gmail.com

В предыдущем уроке серии мы изменили клиентский и серверный скрипты для добавления функционала категорий в нашу простую CMS. Теперь изменим шаблоны для визуального представления новых возможностей.

Обработка события click средствами CSS

smart.noreply@gmail.com

В настоящее время нет официальных средств CSS для обработки события click. Но тем не менее, существуют способы, которые можно использовать для "обнаружения" нажатия с помощью только CSS без JavaScript.

Строим свою CMS на PHP и MySQL. Часть 8

smart.noreply@gmail.com

В предыдущих уроках серии мы начали добавлять функционал категорий в нашу простую CMS. Сделаем следующий шаг - модифицируем скрипты серверной и клиентской частей.

Шалости с элементом canvas: скользящие ленты

smart.noreply@gmail.com

В данном уроке мы продемонстрируем возможности работы с элементом canvas. В итоге получится визуальный эффект с разноцветными скользящими лентами. Никакого Flash - сплошной JavaScript.

Миниатюрная система помощи на сайте

smart.noreply@gmail.com

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

Строим свою CMS на PHP и MySQL. Часть 7

smart.noreply@gmail.com

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

Адаптивный слайдер на CSS3

smart.noreply@gmail.com

В данном уроке мы создадим простую адаптивную страницу с заголовком, украшенным каруселью, в которой изображения проскальзывают справа налево. Наше решение не использует JavaScript, слайдшоу основано на анимациях CSS3, которые поддерживаются в большинстве современных браузеров: Firefoх 15+, Chrome 22+, Safari 5.1+, Opera 12.1+ и IE10.

Строим свою CMS на PHP и MySQL. Часть 6

smart.noreply@gmail.com

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

Focal Ppoint: интеллектуальная обрезка адаптивных изображений

smart.noreply@gmail.com

Практика реализации процесса адаптации изображений все еще находится в стадии развития. Существует большое количество идей и предложений как следует обрабатывать картинки. В данном уроке мы рассмотрим небольшую очаровательную библиотеку, которая позволяет не только автоматически изменять размер изображений при изменении параметров окна просмотра, но также обрезать картинки, принимая во внимание заданную точку фокуса. К тому же, все действия осуществляются на чистом CSS.

Анимированное меню с 3D эффектом на CSS

smart.noreply@gmail.com

В данном уроке мы сделаем простое меню с 3D эффектом при наведении курсора мыши на пункт меню.

Строим свою CMS на PHP и MySQL. Часть 5

smart.noreply@gmail.com

В предыдущем уроке серии мы создали шаблоны для клиентской части. Теперь пришел черед визуального представления серверной части нашей CMS.

Строим свою CMS на PHP и MySQL. Часть 4

smart.noreply@gmail.com

В предыдущих уроках серии мы сделали базу данных и логику приложения для нашей CMS. Теперь разберемся с визуальным представлением. Создадим шаблоны для клиентской части.

Таймер на jQuery

smart.noreply@gmail.com

Таймеров обратного отсчета существует достаточно много. Но иногда требуется определить, сколько времени прошло с момента события. В одном из наших уроков мы строили таймер обратного отсчета в виде плагина для jQuery. Модифицируем его для прямого подсчета прошедших мгновений.

Эффект "трассирования" для навигации

smart.noreply@gmail.com

Простой способ сделать скучное длинное навигационное меню интересным элементом интерфейса веб проекта с помощью магии CSS. Подобная техника используется на сайте www.graphitedesign.com. Трассирующий "эффект" добавляется к элементам обычного списка, на основе которого строится меню. Конечно, результат будет виден только в новых браузерах, но обратная совместимость достигается практически без труда.

Как сделать простые подсказки на CSS3

smart.noreply@gmail.com

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

Эффектное добавление нового содержания на странице

smart.noreply@gmail.com

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

Строим свою CMS на PHP и MySQL. Часть 3

smart.noreply@gmail.com

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

Простые эффекты для выпадающего списка

smart.noreply@gmail.com

В данном уроке мы установим для выпадающего списка простые визуальные эффекты. Идея заключается в трансформации обычного элемента select в эффектный пункт интерфейса с помощью плагина jQuery. Набор опций и параметров позволяет получить различные варианты уникальных эффектов.

Строим свою CMS на PHP и MySQL. Часть 2

smart.noreply@gmail.com

В предыдущем уроке серии мы создали базу данных и конфигурационный файл для нашей простой CMS. Теперь создадим основной класс нашего приложения - Article.

Строим свою CMS на PHP и MySQL. Часть 1

smart.noreply@gmail.com

Задача построения системы управления содержанием (CMS) может привести в замешательство новичка разработчика PHP. Но не так страшен черт, как его малюют! В данной серии уроков мы построим простую, но полностью работоспособную систему с нуля. В первой части мы спланируем нашу систему, а также создадим базу данных и файл конфигурации.

Навигация с эффектом лестницы

smart.noreply@gmail.com

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

WordPress: добавляем фиксированное навигационное меню

smart.noreply@gmail.com

Фиксированная навигационная панель часто встречается на различных ресурсах. Такой функционал достаточно легко воспроизвести на WordPress. Фиксированная панель поможет вашим читателям быстро перейти к интересному разделу из любой точки на странице.

Делаем свой укорачиватель длинных адресов URL

smart.noreply@gmail.com

Наверняка вам встречались адреса URL ссылок на различные ресурсы в записях Twitter или Facebook? составленные с использованием сервисов bit.ly или t.co. Такие сервисы предоставляют короткие псевдонимы для ссылок на страницы с длинными адресами URL. Например, вот псевдоним http://bit.ly/SaaYw5, который соответствует очень длинному URL на результат поиска в Google (тема: как погладить рубашку). Передать 20 символьную ссылку с bit.ly гораздо проще.

Трансформации CSS в адаптивном шаблоне

smart.noreply@gmail.com

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

Baraja: раскинем карты

smart.noreply@gmail.com

Baraja - экспериментальный и эффектный плагин jQuery, который позволяет перемещать элементы в стиле колоды карт на столе. Он использует трансформации CSS для вращения и перемещения пунктов. Доступны несколько опций, которые открывают большое количество вариантов перемещения элементов, например, для смещения в сторону или по кругу.

Эффект "подсунутых уголков" на CSS

smart.noreply@gmail.com

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

PHP: список файлов и директорий

smart.noreply@gmail.com

В данном уроке мы разберемся с типовой задачей, которая возникает во время работы над проектом PHP: получение списка файлов и директорий. Обсудим несколько базовых и более изощренных подходов, с перечисление плюсов и минусов каждого. Первые три решения будут использовать типовые функции PHP, а затем представим более надежное с применением итераторов SPL.

WordPress: HTML код в подписях к изображениям

smart.noreply@gmail.com

Когда вы добавляете изображение на страницу или запись, то можно задать подпись к нему. Каждое добавленное изображение может иметь свою собственную подпись и в ней разрешается использовать стандартные теги форматирования HTML.

Эффект при прокрутке содержания

smart.noreply@gmail.com

В данном уроке мы создадим эффект прокрутки содержания, который используется на новом сайте e-bay. Для примера построим одну адаптивную страницу для представления красоты и пользы лаванды (описания растения на английском языке). JavaScript не задействован - только CSS.

Использование функции wp_editor в WordPress

smart.noreply@gmail.com

Это функция WordPress, которая выводит на страницах или записях редактор WYSIWYG, такой же, как и используемый в инструментах администрирования. Функция доступна в версиях начиная с WordPress v3.3.

11 плагинов jQuery

smart.noreply@gmail.com

В данном уроке представлена коллекция из 11 плагинов jQuery, которые станут отличным дополнением в наборе инструментов веб разработчика.

Цветное выпадающее меню на CSS3

smart.noreply@gmail.com

В данном уроке мы создадим цветное выпадающее меню с использованием только CSS3. Для оформления меню задействуем шрифт с иконками Font Awesome. Такой подход позволяет применять векторные иконки практически в любом браузере. Чтобы добавить иконку к элементу достаточно задействовать элемент :before в таблице стилей.

Настраиваем подсветку синтаксиса LESS в Notepad++

smart.noreply@gmail.com

Бесплатный редактор Notepad++ - отличный инструмент для работы с веб проектами и великолепная замена стандартному Notepad. Одним из замечательных свойств Notepad++ является подсветка синтаксиса различных языков программирования. Но LESS не входит в список. Однако, благодаря другим возможностям редактора, можно организовать подсветку синтаксических конструкций замечательного препроцессора.

Конвертируем CSS в LESS

smart.noreply@gmail.com

В предыдущем уроке серии мы познакомились с LESS - препроцессором CSS, существенно улучшающим возможности разработчика. Но что делать с имеющимися наработками? Есть решение для конвертации CSS кода в LESS.

Представление LESS

smart.noreply@gmail.com

CSS - простой и доступный инструмент. Однако, он имеет свои ограничения, особенно когда встает вопрос о сопровождении готового кода. Когда нужно модифицировать тысячи строк со стилями, разделенных по нескольким файлам, задача становится проблемой. Для преодоления проблемы созданы препроцессоры CSS, которые позволяют комбинировать стили динамически. Существует несколько вариантов (например, LESS и SASS).

Простая техника эффекта параллакса

smart.noreply@gmail.com

Эффект параллакса - очень интересная техника. При прокручивании фоновое изображение перемещается медленнее чем, содержание, а в результате получается иллюзия 3D пространства. В данном уроке мы продемонстрируем простой и эффективный способ получить замечательный эффект.

Подписи к изображениям с визуальными эффектами на CSS3

smart.noreply@gmail.com

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

Вращающееся меню на CSS

smart.noreply@gmail.com

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

Эффект разворачивающейся бумаги

smart.noreply@gmail.com

PFold - экспериментальный плагин jQuery, который формирует эффект разворачивающейся бумаги при открытии элементов. Элементы разворачиваются в 3D для вывода дополнительного содержания. Идея заключается в организации нескольких слоев свертки, на каждом шаге размер элемента удваивается, что имитирует разворачивание бумаги.

Плагин Windy для стремительной навигации

smart.noreply@gmail.com

Windy - плагин jQuery, который позволяет осуществить стремительную навигацию по большому набору пунктов с помощью 3D переходов и трансформаций CSS. Например, можно создать эффект непрерывного потока улетающих карт с колоды или листков отрывного календаря.

Использование мета тега viewport в неадаптивных шаблонах

smart.noreply@gmail.com

Нет сомнения, что вы используете мета тег viewport при работе с адаптивными шаблонами. Но знаете ли вы, что мета тег viewport может быть полезен и для неадаптивных шаблонов? Если у вас нет времени для конвертации шаблона своего проекта в адаптивный, то следует прочесть материалы данного урока, чтобы использовать мета тег viewport для улучшения вида вашего дизайна на мобильных устройствах.

Строим многоколоночный шаблон на CSS3

smart.noreply@gmail.com

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

10 полезных скриптов JavaScript

smart.noreply@gmail.com

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

Twitter эффект при наведении курсора мыши на блок

smart.noreply@gmail.com

В данном уроке мы продемонстрируем технику CSS, которую можно использовать для формирования эффекта hover для группы элементов div и дополнительного выделения выбранного пункта внутри блока.

Создаем модальное окно на HTML5 и CSS3

smart.noreply@gmail.com

Модальные окна - часто используемый инструмент в арсенале веб мастера. Он очень удачно подходит для решения большого количества задач, таких как вывод форм регистрации, рекламных блоков, сообщений и так далее.

Простая и эффективная система кеширования PHP

smart.noreply@gmail.com

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

6 секций кода PHP

smart.noreply@gmail.com

В данном уроке приводится 6 полезных функций на PHP.

Генерация QR кода в приложениях на PHP

smart.noreply@gmail.com

Популярность QR кодов постепенно набирает высоту благодаря возможности включать большой объем данных в единичное изображение и распространению смартфонов, которые обеспечивают быстрое сканирование и декодирование информации

Адаптивное выпадающее меню на CSS3 и jQuery

smart.noreply@gmail.com

В данном уроке мы сделаем адаптивное выпадающее меню на jQuery и CSS3.

10 плагинов WordPress для фиксированной панели сообщений

smart.noreply@gmail.com

Фиксированная панель для сообщений является отличным инструментом для привлечения внимания пользователя вне зависимости от места ее размещения на сайте. Такая панель великолепно справляется с задачей анонсирования события, продукта, бонусов и прочих приятных новостей. Для WordPress существует много плагинов, которые легко использовать и настраивать.

Управляем компьютером через аккаунт Твиттера

smart.noreply@gmail.com

Представим такую ситуацию: вы очень торопитесь и уже находитесь на значительном расстоянии от своего дома, но внезапно вспомнили, что забыли выключить настольный компьютер. И ваш сосед по жилищу может получить доступ к персональным данным (аккаунты в социальных сетях, почтовые ящики и прочее). Что делать?

Преобразуем аккордеон на jQuery в аккордеон на CSS3

smart.noreply@gmail.com

Приходилось ли вам использовать аккордеон в своем проекте? Обычно, для таких задач используется какой-нибудь плагин jQuery или вариант на чистом JavaScript. Назначение аккордеона - демонстрация изображений или списка свойств и особенностей продукта. В таком случае можно легко обойтись только возможностями CSS3? которые позволят обрабатывать событие OnClick и построить анимацию для смены слайдов.

Анимированная открытка с использованием CSS3

smart.noreply@gmail.com

Представим один из примеров практического использования анимаций CSS3 - создание анимированных открыток. В качестве иллюстрации приводится открытка из Парижа.

Навигационное меню с визуальным эффектом на CSS3

smart.noreply@gmail.com

В данном уроке мы сделаем навигационное меню с интересным визуальным эффектом используя только CSS. Будут представлены одноуровневый вариант и выпадающая структура. Для создания эффекта будет применяться псевдо-элемент :after с пользовательским атрибутом.

Простое приложение для записи заметок

smart.noreply@gmail.com

В данном уроке мы сделаем простое приложение на PHP и jQuery, которое будет давать возможность пользователю писать заметки. Заметки будут сохраняться в простых текстовых файлах на сервере. В уроке демонстрируется техника чтения и записи файлов в PHP, изменение размеров области текста с помощью jQuery в зависимости от размера содержания, и простое взаимодействие AJAX.

Интересная контактная форма

smart.noreply@gmail.com

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

Шаблоны CSS3 для кнопок

smart.noreply@gmail.com

Использование различных шаблонов существенно облегчает повседневную работу веб разработчика. Почему бы не сделать прелестные заготовки с помощью CSS3 для кнопок?

Интерактивная диаграмма - быстро и просто

smart.noreply@gmail.com

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

Создаем gif из видео с помощью Cliplets

smart.noreply@gmail.com

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

6 методов создания треугольников

smart.noreply@gmail.com

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

Делаем брошюру с помощью плагина jQuery

smart.noreply@gmail.com

BookBlock - плагин jQuery, который можно использовать для создания компонентов, похожих на брошюры, с навигацией в виде переворачивающихся страниц. Можно использовать любое содержание - текст или картинки. Плагин трансформирует структуру только когда требуется (то есть при переходе на следующую страницу) и использует перекрывающие слои для формирования теней от страниц для создания реалистичного внешнего вида.

Декорируем галерею с помощью CSS3

smart.noreply@gmail.com

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

Индикаторы прогресса на CSS3

smart.noreply@gmail.com

4 индикатора активности процесса, в которых не используется ничего, кроме кода CSS3.

ASCII анимация с помощью спрайта, элемента canvas и JavaScript

smart.noreply@gmail.com

В данном уроке мы сделаем эффектное преобразование спрайта в анимированную ASCII картинку (то есть в изображение, нарисованное с помощью символов). Для реализации задуманного нам понадобится элемент canavas и несколько строк кода на JavaScript.

Аспектно-ориентированное программирование в CodeIgniter. Часть 3 из 3

smart.noreply@gmail.com

В предыдущих частях серии уроков мы рассмотрели концепцию AOP и пользу от ее применения в больших проектах. Также был разобран вопрос использования крюков CodeIgniter для реализации функционала AOP с нуля. В данном уроке мы разберемся с использованием техник XML и аннотирования для создания правил AOP для проектов нуля.

Аспектно-ориентированное программирование в CodeIgniter. Часть 2 из 3

smart.noreply@gmail.com

В предыдущей части серии уроков мы представили аспектно-ориентированное программирование (AOP) и его терминологию. Данный урок даст практические примеры использования AOP и поможет добавить его в приложение на PHP с использованием CodeIgniter.

Создание и получение вложенных объектов на jQuery

smart.noreply@gmail.com

Создание и использование вложенных объектов с помощью указания в виде строки чрезвычайно полезно при работе с динамическими структурами. Не только потому, что отпадает необходимость ручной проверки объекта/свойства, чтобы избежать сообщения об ошибке "{x} is not defined". Если вы создадите свой метод правильно, то сможете устанавливать пустой объект в заданном месте (или пространстве имен) так, что другой пользователь сможет вызвать его

Аспектно-ориентированное программирование в CodeIgniter. Часть 1 из 3

smart.noreply@gmail.com

Вы уже слышали о аспектно-ориентированном программировании (AOP)? Данная концепция широко используется при разработке больших систем. Но при применении PHP она редко встречается. Цикл из 3 статей представляет AOP для PHP разработчиков.

Пропорциональная модульная сетка

smart.noreply@gmail.com

При работе над адаптивным дизайном всегда возникает вопрос с гибкими сетками. Очевидно, что если размер экрана становится больше, шаблон должен изменяться. Как это сделать наилучшим образом?

Разделение медиазапросов

smart.noreply@gmail.com

При появлении медиазапросов разработчики начали использовать их при разработке адаптивных дизайнов для веб проектов. Обычное решение представляет собой различные наборы, которые изменяются для разных размеров рабочей области. Но можно использовать разделение стилей, вместо перезаписи.

Генератор 3D книг на jQuery

smart.noreply@gmail.com

В данном уроке мы сделаем плагин - генератор книг. Основная идея заключается в автоматической генерации интерфейса книги на основе текста (с картинками). Книга состоит из страниц, каждая страница состоит из 2 сторон (как в обычной книге), есть кнопки для перехода на следующую/предыдущую страницу, при переходе на другую страницу используется 3D эффект (на основе CSS3). Для эффекта используются трансформации CSS3 transform (rotate3d, preserve-3d и rotateY) вместе с эффектом перехода.

Добавляем короткий код для адаптивной модульной сетки в WordPress

smart.noreply@gmail.com

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

Пишем письмо в старинном стиле

smart.noreply@gmail.com

Сделаем анимированное старинное письмо. Перо скользит по бумаге, оставляя на ней бессмертные строки. Когда чернила заканчиваются, перо ныряет в чернильницу. иногда случаются ошибки, перо само исправит их.

Кросс-доменная API для сайта

smart.noreply@gmail.com

В данном уроке мы сделаем собственный кросс-доменный API. Может быть вы уже пробовали делать что-то подобное, и, вероятно, сталкивались с невозможностью нормальной работы функций API со сторонних доменов. В основном не получается сделать нормальный запрос AJAX к удаленному серверу и получить ответ в JavaScript функциях. А причина заключается в настройках безопасности. Мы покажем, как решать подобные проблемы.

Навигация с визуальным выделением: просто и эффектно

smart.noreply@gmail.com

В данном уроке сделаем простую, но эффектную навигацию с визуальным выделением пункта при наведении курсора мыши.

Функциональность: плагин против темы

smart.noreply@gmail.com

Существует множество факторов, которые влияют на производительность сайта под управлением WordPress. Одним из моментов, которые всегда упоминаются "экспертами", является рекомендация избегать плагинов. Они утверждают, что лучше размещать функционал внутри темы вместо активации плагина. Верно ли данное утверждение?

Секундомер на чистом CSS3

smart.noreply@gmail.com

В данном уроке мы сделаем секундомер с использованием только CSS3. Для реализации идеи будут применяться кадры анимации CSS3 и свойство управления состоянием анимации (для функционирования кнопок управления секундомером).

Выделение обязательных полей формы с использованием CSS3

smart.noreply@gmail.com

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

Ленточное меню на CSS3

smart.noreply@gmail.com

Используем переходы CSS3 и псевдо-классы CSS2 для создания анимированной навигационной ленты с минимальной разметкой.

Событие click на чистом CSS без :target

smart.noreply@gmail.com

Есть ли способ обрабатывать события click на CSS без использования JavaScript. Можно использовать метод с :target. Но что если его нельзя использовать? Есть другой метод.

Выдвигающееся сверху меню с 3D-эффектом

smart.noreply@gmail.com

В данном уроке мы создадим анимированное 3D навигационное меню (с иконками) с использованием только CSS3 (без JavaScript). Задействуем мощные эффекты CSS3, такие как перспектива, трансформации, градиенты и переходы. Чтобы увидеть меню в действии нужно поместить курсор мыши на голубой элемент вверху страницы.

Представление Laravel

smart.noreply@gmail.com

Laravel гибкая и расширяемая библиотека PHP для веб разработки. Освобождая вас от спагетти кода, Laravel помогает вам создавать прекрасные приложения с помощью простого и выразительного синтаксиса. Разработка должна быть творческим процессом, который доставляет удовольствие, а не причиняет боль.

Фальшивый переход градиента фона

smart.noreply@gmail.com

Трансформации CSS не оказывают эффекта на градиенты фона. Хотя существуют простые способы имитировать плавные переходы градиентов и в данном уроке мы рассмотрим их.

Эффекты с кругами при наведении курсора мыши

smart.noreply@gmail.com

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

Круговой индикатор процесса на CSS

smart.noreply@gmail.com

Такие индикаторы загрузки вы наверняка встречали, особенно на Flash сайтах. Это сектор круга, который становится все больше и больше, пока не превратится в завершенный круг.

Регистрационная форма в один клик с помощью API Google

smart.noreply@gmail.com

А вы знаете, что сервисы Google можно использовать для формы регистрации за один клик на сайте? Каждый, кто имеет аккаунт на Google может нажать кнопку и сразу подключиться к вашему приложению со своим адресом email, именем и фотографией.

Стильная страница установок

smart.noreply@gmail.com

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

Стильные "хлебные крошки" на CSS3

smart.noreply@gmail.com

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

Складывающаяся 3D анимация на CSS

smart.noreply@gmail.com

Google Plus является источником вдохновения многих разработчиков, особенно в сфере использования CSS и JavaScript. В данном уроке воспроизводится эффект сворачивания карты. Для него используются 3D анимации, которые придают шарм визуализации, и не требуется ни строчки кода JavaScript.

Галерея с использованием элемента HTML5 canvas

smart.noreply@gmail.com

В данном уроке мы построим галерею с использованием визуальных эффектов на основе HTML5 и CSS3. Серая "копия" изображения будет создаваться элементом canvas, а визуальное преобразование при наведении курсора будет выполняться трансформациями CSS3.

Настраиваем комментарии в WordPress

smart.noreply@gmail.com

В WordPress есть несколько видов содержания, такие как записи, страницы, комментарии. WordPress является очень гибкой платформой, которая позволяет настраивать основные виды содержания так, как нужно для сайта. Можно поменять внешний вид и функционал. В данном уроке мы покажем, как изменить поведение и внешний вид комментариев на сайте под управлением WordPress.

Стильное поле поиска на CSS3

smart.noreply@gmail.com

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

Создаем адаптивное меню

smart.noreply@gmail.com

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

Красивые рамки в CSS3

smart.noreply@gmail.com

Создание рамок в HTML и CSS доступно с самого появления данных языков. Наверняка вы знакомы со сплошными рамками, рамками с точечными линиями и так далее. Но CSS3 расширяет возможности работы с рамками - теперь можно использовать изображения для создания более привлекательных рамок.

Пипетка для определения цвета на HTML5

smart.noreply@gmail.com

Как сделать простой и полезный инструмент для получения цвета с помощью HTML5. Основная идея - выводим изображение в элемент canvas и добавляем обработку событий для движения мыши и нажатия кнопки (для получения цвета).

Аналоговые часы на CSS3 без JavaScript

smart.noreply@gmail.com

В данном уроке мы сделаем аналоговые часы (со стрелками), используя только CSS. В наших часах будет три стрелки - часовая, минутная и секундная. Каждая из стрелок представляет собой прямоугольник, поворачивающийся на определенный угол. А в основе функционирования лежат трансформации и задержки на рассчитанное время.

15+ решений на основе PHP для организации форума

smart.noreply@gmail.com

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

3D открывающаяся открытка на CSS3 и jQuery

smart.noreply@gmail.com

В данном уроке мы сделаем небольшой компонент с реалистичной имитации работы. Идея заключается в реализации открытки с ручкой, потянув за которую можно раскрыть обложку и прочесть содержание. Будет создан круг с ручкой. Круг будет открываться по нажатии кнопки мыши на ручке. При открытии используется 3D эффект переворачивания страниц с помощью трансформаций CSS3 и теней/градиентов.

Прелестная кнопка на CSS3

smart.noreply@gmail.com

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

PHP: определение предпочитаемого посетителем языка

smart.noreply@gmail.com

В данном уроке демонстрируется техника использования PHP для определения предпочитаемого для посетителя языка. Такой функционал является важной частью сайтов, предназначенных для интернациональной аудитории. Как минимум, он дает возможность установить язык интерфейса, понятный посетителю. Наш скрипт определяет 180 языков.

WordPress: похожие записи без использования плагина

smart.noreply@gmail.com

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

Дизайн таблицы цен с использованием CSS3

smart.noreply@gmail.com

Хорошая таблица цен поможет увеличить конверсию продающих страниц вашего проекта. Очень важно, чтобы она была четкой и понятной с самого начала работы сайта, чтобы посетитель мог сделать лучший выбор конфигурации продукта или услуги.

Выпадающее меню с закладками

smart.noreply@gmail.com

Выпадающее меню с разделением первого уровня на секции с помощью закладок. Часть работы будет выполнять jQuery. Всего в меню имеется три уровня.

Регулятор уровня громкости с использованием слайдера jQuery UI

smart.noreply@gmail.com

В данном уроке мы сделаем стильный элемент для регулировки уровня звука на основе слайдера из jQuery UI. Слайдер будет оформляться с помощью частей файла PSD со стилем для таких элементов.

Индикатор загрузки на CSS3

smart.noreply@gmail.com

В данном уроке представлен вариант создания динамического индикатора процесса на CSS3. Никаких изображений не используется (кроме фона для демонстрации). Представлены три варианта.

Размещаем текст по окружности

smart.noreply@gmail.com

Нет простого и стандартного способа разместить текст по кругу (или по другой кривой). Но задачу можно решить! В данном уроке будет описан один из способов.

HTML5 инструмент для обрезки изображений

smart.noreply@gmail.com

В данном уроке представлен базовый набор функционала для инструмента обрезки изображений на основе HTML5. C помощью такого инструмента изображения можно редактировать на стороне клиента.

Навигация для мобильного устройства

smart.noreply@gmail.com

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

Раскрывающееся поле поиска

smart.noreply@gmail.com

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

Книжка с пробниками на CSS3 и jQuery

smart.noreply@gmail.com

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

Диаграммы и графики на HTML5

smart.noreply@gmail.com

В данном уроке используется интересная библиотека – flotr2, которая предназначена для вывода графиков и диаграмм HTML5. Она позволяет выводить диаграммы в нескольких режимах: линиями, столбиками, секторами. Дле ее работы не требуется никаких других библиотек. Кроме того, она имеет отличную совместимость с различными браузерами.

5 полезных примеров использования PHP

smart.noreply@gmail.com

Пять примеров использования PHP для решения практических задач веб разработчика.

Постраничная навигация для содержания с использованием jQuery

smart.noreply@gmail.com

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

Изменение задержки появления подсказок при наведении курсора

smart.noreply@gmail.com

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

Всплывающий информатор с использованием анимаций CSS3

smart.noreply@gmail.com

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

Стилизация списков с помощью псевдо-элементов

smart.noreply@gmail.com

Стилизация списков с помощью CSS может стать головной болью. Если нужно изменить внешний вид меток пункта списка, то первое, что приходит на ум - свойство list-style: none;. Но использование свойства list-style-image может потребовать для себя много времени на попытки позиционировать вычурные метки. В качестве популярной альтернативы вспоминается background-image для пунктов списка.

Анимированные кнопки на CSS3

smart.noreply@gmail.com

В данном уроке мы сделаем интерактивные анимированные элементы интерфейса с использованием CSS3. Эффект будет проявляться при наведении курсора мыши на кнопку.

Несколько колонок на CSS3

smart.noreply@gmail.com

Вам когда-нибудь надо было создавать многоколоночный шаблон для вывода информации? Чтобы было похоже на колонки в газете. Наверняка, да. Обычный способ реализации такой задачи - элементы разметки со свойством float: left. Но CSS3 предоставляет альтернативу. С ней не нужно резать информацию на блоки - несколько колонок формируются с помощью одного элемента.

Условные теги WordPress. 10 примеров использования

smart.noreply@gmail.com

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

Слайдер на CSS3

smart.noreply@gmail.com

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

3D эффекты для миниатюр при наведении курсора мыши

smart.noreply@gmail.com

В данном уроке мы создадим интересные визуальные 3D эффекты с помощью CSS3 и jQuery. Идея для урока возникла под впечатлением страниц демонстрации проектов Google SketchUp. В нашем примере мы будем использовать миниатюры, которые открывают дополнительную информацию при наведении курсора мыши на них. Структура будет построена на jQuery, который позволит вывести изображение в сложенном или отогнутом виде при наведении курсора мыши. Для формирования эффектов будем использовать трансформации CSS 3D.

Обработка HTML на серверной стороне с помощью phpQuery

smart.noreply@gmail.com

При решении повседневных задач во время разработки проекта приходится работать и с клиентской и с серверной частью кода. Бизнес логика реализуется на PHP, HTML код генерируется для вывода данных в браузере пользователя. Затем используются библиотеки, такие как jQuery или Prototype, для формирования интерактивной клиентской части. Стоит задуматься о том, как изменять и манипулировать сгенерированной структурой HTML с помощью кода PHP серверной части приложения. phpQuery является отличным решением для такой задачи. Данный урок представляет собой краткое введение в phpQuery и объясняет, как можно использовать его в реальных проектах.

3D текст, расположенный по кругу с помощью HTML5

smart.noreply@gmail.com

Используем HTML5 для создания текста с эффектами 3D (с помощью теней) и расположения его по кругу. Также будет выполняться анимация движения букв.

Индикатор сложности пароля на CSS3

smart.noreply@gmail.com

В данном уроке мы сделаем индикатор сложности пароля. Определение уровня сложности производится плагином jQuery Complexify и выводится в наглядном виде. Отправка данных формы регистрации возможно только тогда, когда достигнут заданный уровень сложности пароля.

3D кнопки на CSS

smart.noreply@gmail.com

В данном уроке мы создадим 3D кнопки с применение только CSS команд.

Выскальзывающая панель навигации на CSS3

smart.noreply@gmail.com

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

Аккордеон на CSS3

smart.noreply@gmail.com

В данном уроке мы создадим аккордеон для изображений, который будет раскрывать картинки по нажатию кнопки мыши. С помощью комбинаторов соседей и вложенной структуры мы можем управлять открыванием слайдов с помощью радио кнопок.

Фильтрация ввода в PHP встроенными функциями

smart.noreply@gmail.com

Функции фильтрации PHP, скорее всего, не являются будоражащим сознание артефактом, но они помогают улучшить стабильность, безопасность и внутреннюю структуру кода, если ими правильно пользоваться.

Выпадающее меню на CSS3

smart.noreply@gmail.com

Выпадающее меню на CSS3. Выпадающие цветные панели анимированы трансформациями. Все эффекты и внешний вид создаются только командами CSS.

Конструктор лица на HTML5

smart.noreply@gmail.com

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

Раздвигающееся вертикальное меню на CSS3

smart.noreply@gmail.com

В данном уроке представлено вертикальное раздвигающееся меню на CSS3. Подпункты появляются при нажатии основного пункта.

Доступ к базе данных в PHP

smart.noreply@gmail.com

Практическая часть использования PDO API для работы с базой данных.

Навигационное меню в элементе HTML5 canvas

smart.noreply@gmail.com

Навигационное меню в HTML5 можно построить прямо в элементе canvas. В демонстрации также формируется эффект пламени.

Интроспекция и отражение в PHP

smart.noreply@gmail.com

В данном уроке описывается использование функции интроспекции в PHP и Reflection API для получения информации о классах, интерфейсах, свойствах и методах. Такие действия нужны для составления полной картины о коде в момент выполнения и создания сложных приложений.

Фавиконки рядом со ссылками

smart.noreply@gmail.com

При оформлении страниц сайта очень интересным свойством может быть автоматическая вставка фавиконки рядом со ссылкой на другие ресурсы. К сожалению, только средствами CSS сделать универсальное решение не получится, но немного jQuery помогут добиться замечательного результата.

Прыгающий мячик на CSS3

smart.noreply@gmail.com

В данном уроке представлен пример мощности CSS3. Мы сделаем 3D мяч, который будет выглядеть очень реалистично с помощью свойств CSS3 и добавим немного анимаций для формирования визуального эффекта.

Пользовательские запросы SQL для WordPress

smart.noreply@gmail.com

C помощью пользовательских запросов вы сможете читать любые данные и/или манипулировать ими так, как хочется. Новый мир WordPress открывается перед вами.

Выскальзывающее меню на CSS3

smart.noreply@gmail.com

В данном уроке мы сделаем выскальзывающее меню на CSS3. Весь функционал реализуется без использования JavaScript.

Слайдер с использованием плагина jQuery Chop Slider

smart.noreply@gmail.com

В данном уроке мы сделаем слайдер с помощью плагина jQuery Chop. Данный плагин предоставляет возможность использовать 200 различных эффектов для оформления переходов между слайдами. Эффекты формируются и в 2D и в 3D пространстве. Также имеются несколько эффектов без использования CSS3 (для старых браузеров) и пять эффектов для браузеров мобильных устройств.Также можно создавать свои собственные трансформации (если есть желание).

Закладки в стиле Google Play на CSS3 и jQuery

smart.noreply@gmail.com

Закладки - очень часто встречающийся элемент интерфейса веб приложений. Существует бесчисленное множество методов и стилей их реализации, но идея остается одной и той же: нажать на закладку и увидеть содержание без обновления страницы.

Используем итераторы SPL. Часть 2

smart.noreply@gmail.com

В первой части серии были описаны некоторые стандартные итераторы SPL с примерами их использования. Но в практической деятельности очень часто функционала стандартных итераторов оказывается недостаточно. В таких случаях приходится создавать свои собственные итераторы, а SPL предоставляет интерфейсы для решения практических задач.

Мега меню с выскальзывающими панелями на CSS3

smart.noreply@gmail.com

Мегаменю на CSS3 - выскальзывающие панели со списками ссылок. Для анимации используются трансформации, которые работают только в новейших браузерах Firefox, Chrome, Safary, IE9, Opera10. Меню будет работать и в старых браузерах но без анимации.

5 примеров использования jQuery для AJAX

smart.noreply@gmail.com

AJAX – группа технологий, которая используется в веб разработке для создания интерактивных приложений. AJAX позволяет передавать данные с сервера без перезагрузки страницы. Таким образом можно получать очень впечатляющие результаты. А библиотека jQuery существенно облегчает реализацию AJAX с помощью встроенных методов.

5 трюков CSS для адаптивных шаблонов

smart.noreply@gmail.com

Сделать адаптивный шаблон сайта достаточно просто, но поддерживать элементы в сбалансированном виде во всех точках изменения шаблона - вот что является настоящим искусством. В данном уроке представлены 5 методов для использования в CSS для адаптивного шаблона. Есть очень простые свойства CSS, такие как min-width, max-width, overflow и относительные значения, но они все играют важную роль в разработке адаптивных дизайнов.

Страничная навигация на jQuery

smart.noreply@gmail.com

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

Калейдоскоп на CSS3 и JavaScript

smart.noreply@gmail.com

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

Используем итераторы SPL. Часть 1.

smart.noreply@gmail.com

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

Перекрывающий слой с аннотациями для изображений

smart.noreply@gmail.com

В данном уроке мы сделаем эффект для вывода небольших аннотаций на изображении с использованием CSS (псевдо-класса :checked и комбинаторов). Идея заключается в организации вывода покрывающего слоя с небольшими блоками аннотаций.

Условная загрузка CSS и JavaScript файлов для отдельных страниц

smart.noreply@gmail.com

Хорошей практикой при работе с WordPress является привычка организовывать загрузку файлов только тогда, когда нужно. Данный принцип касается как клиентской части, так и инструментов администратора. Нет причин загружать CSS и JavaScript файлы для всей панели администратора, когда они нужны только на одной странице. В WordPress имеется инструмент, который позволяет реализовать такой функционал с помощью только одной функции.

Прототипы в JavaScript

smart.noreply@gmail.com

Когда вы определяете функцию в JavaScript она получает несколько предопределённых свойств. Одним из таких свойств является мнимый прототип. В данном уроке мы рассмотрим, что такое прототип, зачем и когда его нужно использовать.

Управление привилегиями пользователя на основе ролей

smart.noreply@gmail.com

В данной статье описывается реализация доступа на основе ролей (role based access control - RBAC). RBAC - модель системы разграничения прав доступа, в которой роли используются для выполнения различных задач, а разрешения на выполнение операций привязываются к ролям. Пользователь может получать одну или несколько ролей, которые ограничивают его полномочия на действия в системе.

Резиновое слайдшоу с эффектом параллакса на CSS3

smart.noreply@gmail.com

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

Многоуровневое меню на CSS3

smart.noreply@gmail.com

Меню на CSS становятся все более популярными. CSS3 открывает новые возможности в оформлении стандартных элементов интерфейса визуальными эффектами без привлечения дополнительных средств, таких как JavaScript или изображений. В данном уроке представлено очередное меню на CSS, которое будет работать в браузерах начиная с IE8+ (в старых версиях не будут выводиться тени и скругленные углы пунктов меню).

Защищаем сайт от спама с помощью Akismet

smart.noreply@gmail.com

В данном уроке пойдет речь о защите сервера от спама. Что такое спам? Спам - сообщение, которое не соответствует содержанию страницы. Обычно такие сообщения содержат рекламу и ссылку на ресурс в сети. Первая линия обороны от спама - капча. Но спаммеры постоянно ищут способы обхода первой линии (и очень часто такие поиски завершаются успешно). Поэтому оборона должна иметь несколько эшелонов. Вторым может стать веб сервис (в нашем случае Akismet).

Меню в стиле MS Office

smart.noreply@gmail.com

В данном уроке мы создаем кроссбраузерное многоуровневое меню в стиле MS Office. Используется только CSS3, а для иконок можно задействовать другие изображения.

Искажающая сфера в элементе canvas HTML5

smart.noreply@gmail.com

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

Построение простого виджета для WordPress

smart.noreply@gmail.com

Создание виджета WordPress очень похоже на построение плагина, но является более простым и явным процессом. Все, что нужно - один файл, в котором будет находиться весь код PHP (для плагина может потребоваться достаточно сложная файловая структура).

Полноэкранное слайдшоу на CSS3

smart.noreply@gmail.com

В данном уроке мы сделаем полноэкранное слайдшоу фоновых изображений с использованием только CSS3. В демонстрации представлены несколько различных эффектов с использованием трансформаций и анимаций CSS.

Отключаем трансформации CSS до завершения загрузки страницы

smart.noreply@gmail.com

При использовании трансформаций CSS для структурных элементов страницы иногда получается, что переходы начинаются еще до завершения загрузки страницы. Такие элементы "выпадают" из шаблона.

Навигация для портфолио

smart.noreply@gmail.com

Сделаем навигацию по портфолио с помощью jQuery. Изображения сгруппированы по разным тематикам, а навигация осуществляется в 2D пространстве с указанием положения на специальном индикаторе.

Расставляем префиксы и сжимаем CSS автоматически

smart.noreply@gmail.com

Существует множество способов сжать файл CSS или автоматически генерировать префиксы браузеров для CSS3. Обычно для решения такой задачи требуется дополнительная утилита, которая может быть достаточно неудобной в использовании. В данном уроке мы рассмотрим, как такая задача может быть решена с помощью PHP.

Магические методы и предопределенные константы в PHP

smart.noreply@gmail.com

В PHP имеется набор специальных предопределенных констант и магических методов для ваших проектов. В отличие от обычных констант, которые можно устанавливать с помощью define(), значение предопределенных констант зависит от того, где они используются, и является информацией только для чтения о коде и PHP системе. Магические методы можно использовать в ваших классах для получения доступа к специальному функционалу PHP.

Используем псевдоселектор :target

smart.noreply@gmail.com

Описание возможного применения псевдоселектора :target с некоторыми нюансами использования.

Тени у треугольников

smart.noreply@gmail.com

C помощью CSS можно создавать треугольники. Но что если нужно иметь тени под ними? К сожалению, классический трюк с рамками не меняет формы элементов, он только создает визуальную иллюзию. Поэтому посмотрим на альтернативные решения.

Интерактивное меню на CSS3 и jQuery

smart.noreply@gmail.com

В данном уроке мы сделаем интерактивное оригинальное меню с использованием CSS3 и jQuery.

Методы соединения элементов inline-block

smart.noreply@gmail.com

Серия элементов со свойством inline-block достаточно часто используется при построении структуры страницы. Но если использовать простое форматирование, то между элементами стоящими рядом будет промежуток. Однако очень часто требуется, чтобы такие элементы располагались вплотную друг к другу. Особенно при организации навигационных меню, где такие пробелы могут портить всю визуальную структуру.

Многотомный фотоальбом

smart.noreply@gmail.com

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

Меняем слова в предложениях с помощью CSS3

smart.noreply@gmail.com

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

5 легких альтернатив jQuery на поле разработок для мобильных устройств

smart.noreply@gmail.com

jQuery - отличный инструмент веб мастера. Но есть ситуации, когда выбор в пользу jQuery может оказаться ошибочным. Если вам нужно выполнить простую манипуляцию с DOM или один-два запроса AJAX, то зачем увеличивать время загрузки страницы и создавать дополнительные зависимости?

15 скриптов для лайтбокса

smart.noreply@gmail.com

Если вам попадется сайт для изображений, построенный на jQuery, то, наверняка, на нем будет использоваться лайтбокс. Сила лайтбокса заключается в том, что он может превратить даже простую библиотеку картинок в привлекательную и эффективную галерею

Анимированные закладки на CSS3

smart.noreply@gmail.com

Закладки для различных блоков содержания являются популярным и универсальным инструментом в веб дизайне. В данном уроке мы сделаем закладки на основе радио кнопок с помощью псевдо класса :checked и комбинаторов.

Слайдшоу с 3D эффектами

smart.noreply@gmail.com

Для создания впечатляющих 3D презентаций есть отличная библиотека JavaScript impress.js. В jQuery имеется портированная версия в виде плагина jmpress.js, которая позволяет использовать все функции с дополнительными опциями. В данном уроке мы сделаем адаптивное слайд шоу с 3D эффектами с использованием готовых решений.

Летящее меню на CSS3

smart.noreply@gmail.com

Еще один вариант меню на CSS3 с интересным визуальным эффектом. При наведении курсора мыши пункт меню начинает биться, словно сердце, а подпункты вылетают справа.

Индикатор загрузки на CSS3

smart.noreply@gmail.com

Сделаем анимированный индикатор загрузки на CSS3 без использования каких-либо изображений. Будем использовать две синхронизированные анимации - одну для формирования плавного изменения цвета,а вторую - для вращения всей композиции.

Эффектный вывод дополнительной информации в галерее изображений

smart.noreply@gmail.com

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

Анимированный фотобаннер

smart.noreply@gmail.com

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

Нижнее навигационное меню на CSS3

smart.noreply@gmail.com

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

Простой пример использования шаблона jQuery

smart.noreply@gmail.com

Простой пример использования шаблонов jQuery. Они помогают форматировать вывод полученных данных (например, через AJAX). Или можно использовать специально подготовленные данные.

Сортировка альбома с помощью HTML5

smart.noreply@gmail.com

Все современные браузеры имеют поддержку функций "перетащи и брось". Значит мы можем использовать их в своих проектах и код будет достаточно простым. А в качестве практической реализации сделаем фотоальбом с возможностью раскладки фотографий по разным разделам.

Модальные окна на CSS3

smart.noreply@gmail.com

Сделаем модальное всплывающее окно на CSS3. Обычно для получения такого эффекта используется jQuery. Но CSS3 имеет все необходимые инструменты для реализации такого функционала.

Фотогалерея с использованием только CSS3

smart.noreply@gmail.com

В данном уроке мы сделаем фотогалерею с лайтбоксом только на CSS3 (никакого JavaScript). Будут использоваться следующие свойства CSS3: user-select, box-sizing, transition, box-shadow и transform.

Кубическое 3D слайдшоу

smart.noreply@gmail.com

В данном уроке мы сделаем анимированное кубическое 3D слайдшоу (изображения располагаются на гранях куба). Куб постоянно вращается.

Добавление эффекта сепии к изображению на HTML5

smart.noreply@gmail.com

Урок демонстрирует возможности HTML5 для генерации эффекта на изображении. На тестовые картинки будет накладываться сепия, а результат можно будет скопировать в элемент .

Меню в стиле лава-лампы на CSS3

smart.noreply@gmail.com

В одном из предыдущих уроков демонстрировался процесс создания плагина для эффектного меню в стиле лава-дампы. Теперь создадим подобное меню без использования JavaScript, а только с помощью CSS3.

Навигация для сайта на CSS3

smart.noreply@gmail.com

В данном уроке мы сделаем систему навигации по сайту с использованием только CSS3. Идея заключается в организации нескольких слайдов или слоев с содержанием, которые будут выводиться и скрываться с помощью псевдо-класса :target. C помощью переходов CSS можно сделать отличные визуальные эффекты появления слайдов. Также наша навигация будет адаптивной.

Грамотное сворачивание содержания в адаптивном шаблоне

smart.noreply@gmail.com

Адаптивный дизайн сайтов имеет свои ограничения и подводные камни. Распространенной практикой изменения верстки содержания при уменьшении ширина окна просмотра является уродливая формула: 1) все перестраивается в одну колонку; 2) информация из боковой панели сдвигается вниз. Но более практичный и оптимальный вариант требует искусного переплетения информационных потоков различных типов содержания по примеру сложенных пальцев рук.

Отладка JavaScript для начинающих

smart.noreply@gmail.com

В последние несколько лет благодаря появлению различных библиотек, таких как jQuery и Prototype, JavaScript завоевал лидирующее место среди языков для создания скриптов для веб проектов. Результатом увеличения сложности приложений является необходимость в наличии мощных инструментов для отладки, которые позволяют быстро и эффективно найти источник ошибки. Простой вывод значений переменных с помощью функции alert() потерял свою актуальность.

Краткий обзор файла configuration.php для системы Joomla!

smart.noreply@gmail.com

При перемещениях или других действиях с сайтом под управлением Joomla частенько требуется решить небольшие проблемы с настройкой путей, паролей, базы данных и других основных моментов конфигурации. Большая часть таких вопросов легко решается прямым редактированием файла конфигурации configuration.php.

Часы с использованием HTML5

smart.noreply@gmail.com

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

Вертикальное меню на CSS 3

smart.noreply@gmail.com

Сделаем вертикальное меню с возможностью переключения цвета и 3D эффектом при разворачивании подпунктов. Используется только CSS3.

Анимированный шестеренчатый механизм на CSS3

smart.noreply@gmail.com

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

Использование капчи в Joomla 2.5

smart.noreply@gmail.com

Обратной стороной использования популярных систем, таких как Joomla, WordPress или Drupal, является то, что спаммеры знают, как устроено программное обеспечение. Поэтому вполне вероятна ситуация, когда на сайте имеется большое число регистраций для спама.

WordPress: Используем радиокнопки для таксономии

smart.noreply@gmail.com

Пользовательская таксономия в WordPress - просто фантастический инструмент. Он позволяет организовать записи так как нужно, а всю черную работу берет на себя. Однако и у него есть свои ограничения.

Слайдер с эффектом параллакса

smart.noreply@gmail.com

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

Создаем адаптивное навигационное меню

smart.noreply@gmail.com

Меню навигации достаточно простой элемент дизайна. Создаем неупорядоченный список, задаем его стиль смещения влево и формируем внешний вид. Но адаптивный дизайн, который набирает популярность, выдвигает новые требования к меню.

Форма подписки на CSS3

smart.noreply@gmail.com

C помощью CSS3 создаем простую и приятную форму подписки.

5 впечатляющих примеров использования карт

smart.noreply@gmail.com

Приложения с определением места, контактные страницы и даже портфолио можно существенно улучшить, если разумно использовать карты.

Впечатляющее представление продукта на CSS3

smart.noreply@gmail.com

Страница описания продукта является местом, где сконцентрирована информация о вашем товаре. Именно здесь закладывается интерес посетителя к представляемому предмету или услуге. Как правило, на такой странице содержится общее описание продукта, особенности и несколько изображений. Подать оригинально такую информацию достаточно сложно. Но есть библиотека JavaScript, которая поможет решить задачу.

Создаем эффект для галереи изображений: стопка фотографий

smart.noreply@gmail.com

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

10+ запросов SQL для очистки базы данных WordPress

smart.noreply@gmail.com

После многих лет использования ваша база данных WordPress может содержать непонятные символы, ненужные более данные и прочий информационный мусор. В данном уроке рассматривается 10 запросов SQL для очистки базы данных WordPress.

Выскальзывающие блоки на CSS3

smart.noreply@gmail.com

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

Создаем единую страницу для обработки ошибок

smart.noreply@gmail.com

В данном уроке представлено очень простое решение для обработки различных ошибок HTTP, таких как 404, 500 и так далее, в одном файле PHP. Нужно создать массив кодов ошибок и установить правила перенаправления на наш PHP файл. То есть, можно использовать одну страницу для обработки нескольких ошибок.

AJAX с помощью jQuery. Руководство для начинающих. Часть 3

smart.noreply@gmail.com

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

AJAX с помощью jQuery. Руководство для начинающих. Часть 2

smart.noreply@gmail.com

В предыдущем уроке серии мы дали общее определение технологии AJAX и рассмотрели простой пример с использованием метода $.get(). Теперь продвинемся дальше и посмотрим, что еще можно делать с помощью AJAX и как.

AJAX с помощью jQuery. Руководство для начинающих. Часть 1

smart.noreply@gmail.com

Первый урок серии посвящен общему описанию технологии AJAX и реализации запросов с помощью метода $.get().

Создаем форму для ввода глобальных пользовательских параметров

smart.noreply@gmail.com

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

Простое слайдшоу на jQuery

smart.noreply@gmail.com

Таймер - отличный инструмент для создания различных трюков с помощью JavaScript. Типичный пример использования таймера - галерея изображений типа "карусель". Обычно плагины для таких галерей имеют несколько опций и обязательно в набор входит установка смены изображения через заданный интервал времени (обычно, несколько секунд). В данном уроке демонстрируется принцип организации карусели.

10 несуразностей и секретов JavaScript

smart.noreply@gmail.com

JavaScript. Причудливый и все-таки прекрасный язык программирования. Если бы Пабло Пикассо был программистом, то он наверняка бы разработал именно JavaScript. Null является объектом, пустой массив эквивалентен false, а функции перебрасываются словно теннисные мячи.

8 ловушек CSS и методы их обхода

smart.noreply@gmail.com

Когда пишется код CSS, очень легко попасть в одну из ловушек. Чтобы их преодолеть, нужно использовать небольшие и эффективные трюки.

Лента для оформления сайта с использованием только CSS

smart.noreply@gmail.com

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

Разгребаем асинхронные задачи с помощью Promise-объектов jQuery

smart.noreply@gmail.com

Promise-объекты представляют собой одну из впечатляющих особенностей jQuery, которая позволяет легко управлять асинхронными событиями. С их помощью вы будете писать более понятные, короткие возвратные функции и отделять высокоуровневую логику приложений от низкоуровневых операций.

PDO против MySQLi. Что выбрать?

smart.noreply@gmail.com

Когда возникает вопрос о доступе к базе данных из кода PHP, есть два варианта: MySQLi и PDO. Что нужно знать, прежде чем сделать выбор? Различия, поддержка баз данных, стабильность, и производительность в общих чертах описываются в данном уроке.

Стильная страница FAQ с использованием только CSS3

smart.noreply@gmail.com

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

Создаем стиль тетрадного листа

smart.noreply@gmail.com

В данном уроке мы сделаем страницы похожими на тетрадь в линейку с помощью CSS и неупорядоченного списка.

Автоматическое резервное копирование базы данных

smart.noreply@gmail.com

Каждая база данных нуждается в резервном копировании. Если вы делаете его вручную, то пора переходить к автоматическому варианту с использованием простого решения на PHP. C помощью данного скрипта вы сможете сохранять отдельную таблицу или всю базу целиком.

Аккордеон на CSS3

smart.noreply@gmail.com

Используя только скрытые элементы ввода и метки мы сделаем аккордеон с анимацией процесса закрытия/открытия разделов содержания, задействовав только CSS.

Формирование сообщений с использованием CSS3 и jQuery

smart.noreply@gmail.com

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

Еще одно меню на CSS3

smart.noreply@gmail.com

Создаем простое меню с использованием только CSS3.

CSS3 + jQuery = закладки для содержания

smart.noreply@gmail.com

В данном уроке приводится очередной вариант организации закладок для компактного вывода содержания. Для формирования внешнего вида используется CSS3, а функционал реализуется несколькими строками JavaScript кода.

Стили CSS3 для упорядоченных списков

smart.noreply@gmail.com

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

Управляем датой и временем

smart.noreply@gmail.com

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

Возвратные функции JavaScript

smart.noreply@gmail.com

Если у вас есть хотя бы небольшой опыт работы с JavaScript, то наверняка вы уже использовали возвратные функции. Но может быть, полного понимания о том, как они работают, нет.

8 примеров использования cURL вместе с PHP

smart.noreply@gmail.com

cURL и его расширение для PHP libcURL являются очень полезными инструментами при решении таких задач, как имитация веб браузера, отправка форм или регистрация на веб сервисе. В данном уроке мы рассмотрим несколько интересных применений cURL совместно с PHP.

Переходы между разделами страницы с использованием CSS3

smart.noreply@gmail.com

В последнее время увеличивается количество одностраничных сайтов. которые используют JavaScript для формирования различных эффектов для переходов между разделами. В данном уроке мы рассмотрим как построить такой шаблон, но будем использовать средства CSS для формирования перехода между разделами.

Полноэкранная галерея с навигацией

smart.noreply@gmail.com

В данном уроке представлена галерея полноэкранных изображений (16 слайдов). Все изображения составлены в огромное поле 4х4. Навигация осуществляется с помощью миниатюрной карты, на которой можно выбрать нужный участок галереи, или с помощью стрелок на изображениях. Переход между изображениями выполняется плавным скольжением.

Звездный рейтинг на CSS

smart.noreply@gmail.com

Звездный рейтинг является классическим элементом интерфейса пользователя. Любому веб мастеру хотя бы раз приходилось иметь дело со "звездочками". В данном уроке представлена идея, как сделать интерфейсную часть рейтинга без JavaScript несколькими строчками кода CSS.

Небольшое введение в мультисайт WordPress

smart.noreply@gmail.com

WordPress стал самой используемой CMS в мире. В данном уроке мы представим одну из интересных возможностей WordPress - мультисайт (известную также как создание сети). С помощью мультисайта можно создать несколько блогов, которые будут использовать одни и те же файлы CMS, базу данных, плагины, темы. Можно вставлять в блог записи из другого блога сети. Можно динамически создавать блоги в разных доменах и многое другое.

Дизайн "хлебных крошек" на основе CSS3

smart.noreply@gmail.com

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

Введение в использование файла .htaccess

smart.noreply@gmail.com

Файл .htaccess используется для конфигурации сервера Apache, впрочем, и для нескольких других серверов тоже. Не смотря на странное расширение, он является простым текстовым файлом, который можно модифицировать в любом редакторе. В данном уроке мы рассмотрим, как .htaccess можно использовать в своих проектах.

Иерархия выполнения файлов темы WordPress

smart.noreply@gmail.com

В данном уроке описана иерархия файлов в теме WordPress. Мы разберемся, какие файлы используются, когда загружается страница. Может быть, вы уже знаете, что конкретные записи обслуживаются файлом single.php, а страница - page.php. Но WordPress ищет различные файлы в зависимости от имеющихся факторов, и очень полезно иметь представление об общей картине.

Всплывающие подсказки на CSS3

smart.noreply@gmail.com

В данном уроке представлен очередной вариант организации всплывающих подсказок на CSS3. Используются CSS переходы и псевдо-элементы :before и :after.

WordPress: разбиваем текст записи на страницы

smart.noreply@gmail.com

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

Эффект приближения для миниатюр

smart.noreply@gmail.com

Создадим эффект приближения для миниатюр с помощью jQuery. Масштаб миниатюр будет изменяться в зависимости от расстояния между ними и курсором мыши.

Связанные шаблоны плагина jQuery Template

smart.noreply@gmail.com

В предыдущем уроке серии мы рассмотрели простой пример использования плагина jQuery Template, разработанного командой Microsoft Ajax Core. Теперь разберем связанные шаблоны, которые позволяют полностью контролировать структуру документа.

Вы используете шаблоны JavaScript?

smart.noreply@gmail.com

Наверняка многие читатели знакомы с какой-нибудь серверной системой шаблонов, например, Smarty или Cheetah. Но есть шаблон, который выполняется на стороне клиента - плагин jQuery Template, созданный в недрах Microsoft. В современных условиях усложнения веб приложений его использование имеет ясный практический смысл.

10 советов по усилению безопасности сайта под управлением WordPress

smart.noreply@gmail.com

WordPress стал очень популярной платформой в наши дни (около 8.5% всех веб сайтов работают под управлением WordPress!). Так как данная система имеет открытый исходный код, то любой желающий может исследовать внутренне строение системы и экспериментировать с методами взлома. Более миллиона сайтов WordPress было взломано за прошедший год. Но с помощью небольших усилий вы можете защитить ваш сайт под управлением WordPress и усилить его безопасность.

Выводим сообщение о старости записи

smart.noreply@gmail.com

Если вы публикуете в своем блоге информацию, которая может устареть со временем, то будет очень полезно наглядно информировать читателя о времени, прошедшем с начала публикации.

Выводим сообщения об ошибках PHP в оповещениях администратора

smart.noreply@gmail.com

PHP используется во многих веб приложениях, например, в WordPress. Не смотря на мощные средства языка, PHP имеет некоторые недостатки. Один из самых существенных - вывод сообщений об ошибках прямо на веб странице. Панель инструментов WordPress 3.3 закрывает первые несколько строк на странице, что мешает разработчику в процессе отладки.

Анимированный баннер на CSS3

smart.noreply@gmail.com

Создаем рекламный анимированный баннер с использованием возможностей CSS3. А в старых браузерах он будет простой статичной картинкой.

Скользящие панели изображений на CSS3

smart.noreply@gmail.com

В данном уроке мы разберемся задачей создания прелестных скользящих панелей с изображениями. Будет использоваться только CSS. Идей заключается в применении фоновых изображений для панелей и анимации при нажатии на метку. В качестве меток будут использоваться радио кнопки.

4 простых эффекта CSS для кнопок

smart.noreply@gmail.com

В данном уроке рассматриваются четыре очень простых кнопки CSS с эффектами анимации при наведении курсора мыши на них.

Придаем меню особенный вид с помощью CSS3

smart.noreply@gmail.com

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

10 методов для замены jQuery чистым JavaScript в проектах

smart.noreply@gmail.com

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

Кнопки в стиле сайта YouTube

smart.noreply@gmail.com

Последняя вариация дизайна сайта YouTube имеет интересный вид кнопок (большей частью они расположены в нижнем колонтитуле), которые в обычном состоянии имеют еле различимую рамочку, но при наведении курсора мыши на них как бы "всплывают", побуждая посетителя нажать их.

Интересные стили для заголовков с использованием псевдо-элементов

smart.noreply@gmail.com

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

10 советов по оптимизации темы WordPress

smart.noreply@gmail.com

Прелесть WordPress состоит в том, что его можно легко адаптировать для решения любых задач. Любому по силам расширить возможности системы, добавив пару строк кода. В данном уроке мы рассмотрим 10 способов, которые помогут улучшить тему WordPress.

Создаем закладки на странице установок WordPress

smart.noreply@gmail.com

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

Эластичное слайдшоу с миниатюрами

smart.noreply@gmail.com

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

Выводим избранные твиты с помощью PHP и jQuery

smart.noreply@gmail.com

Если у вас есть профиль в Twitter, то наверняка вы ищете способ выводить ваши твиты на вашем сайте или блоге. Данная задача имеет отличное решение в виде плагина jQuery. Но что если надо выводить только определённые твиты? В Twitter есть инструмент для решения такой задачи - отмечать тивиты избранными. В данном уроке мы сделаем класс PHP который будет извлекать, помещать в кэш и выводить избранные твиты. для интерфейса будет использоваться CSS3.

Контроль доступа с использованием битовой маски

smart.noreply@gmail.com

В данном уроке мы организуем контроль прав доступа к информации с помощью битовой маски. Битовая маска является простым и быстрым способом определения возможностей пользователя.

Таймер обратного отсчета на jQuery

smart.noreply@gmail.com

При создании информационной страницы для какого-либо события очень полезным элементом будет дисплей с обратным отсчетом времени. Счетчик подстегивает посетителя визуализацией утекающий сквозь пальцы секунд, что в сочетании с полем для введения адреса email может существенно увеличить базу подписчиков.

Создаем систему комментирования

smart.noreply@gmail.com

В данном уроке мы создадим собственную систему комментирования (с использованием AJAX) разных пунктов списка (может быть все что угодно на вашем сайте - статьи, товары, фотографии и так далее) с применением PHP. В системе будет использоваться простая защита от спама - можно размещать только один комментарий в течении 10 минут.

Автоматическое изменение размера элемента textarea

smart.noreply@gmail.com

В данном уроке представлено решение задачи автоматического изменения размера элемента textarea в соответствии с содержанием, которое может быть загружено динамически с помощью AJAX. Размер содержания не известен, а элемент textarea не изменяет размера естественным образом, как другие элементы HTML. Поэтому нужно использовать JavaScript для изменения высоты элемента каждый раз при обновлении содержания.

Как создать адаптивную галерею миниатюр

smart.noreply@gmail.com

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

Гостевая книга на PHP

smart.noreply@gmail.com

В данном уроке мы создадим гостевую книгу на PHP с использованием AJAX. Записи будут храниться в базе данных. Таблица будет содержать следующую информацию: имя отправителя, адрес email, IP адрес и дата-время последней записи. Будет использоваться jQuery (для реализации AJAX). Также будет реализована простая защита от спама - можно размещать не более одной записи каждые 10 минут.

Автозаполнение полей с использованием PHP, MySQL, jQuery и XML

smart.noreply@gmail.com

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

10 онлайн сервисов для работы с цветовыми схемами

smart.noreply@gmail.com

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

Рисуем плавную кривую в PHP с использованием GD

smart.noreply@gmail.com

В данном уроке мы выведем график на PHP с использованием библиотеки GD. Кривая будет сглаживаться с помощью интерполяции кубическими сплайнами.

Смена фоновых изображений для события hover

smart.noreply@gmail.com

В данном уроке мы разберемся как создать интересный эффект, который будет проявляться при наведении курсора мыши на объект. Будет включаться очень быстрое слайдшоу, которое может привлекать внимание посетителя своей динамикой.

Проскальзывающие ячейки изображения

smart.noreply@gmail.com

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

Таблица цен с использованием CSS3

smart.noreply@gmail.com

При разработке таблицы с ценами на услуги или товары задача веб дизайнера заключается в том, чтобы таблица легко читалась, была проста для восприятия и интуитивно понятна. Такие требования помогают пользователю быстро и легко найти то, что ему нужно.

Триггер для событий hover и click в круглом элементе

smart.noreply@gmail.com

Использование псевдо класса :hover широко известно как классический способ реагирования на наведение курсора мыши на элемент. Проблема проявляется при задействовании свойства border-radius для получения круглых элементов - событие hover генерируется при наведении курсора мыши на описывающий прямоугольник, а не только для действительно видимой области.

Стрелки для заголовков

smart.noreply@gmail.com

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

Снегопад на сайте

smart.noreply@gmail.com

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

10 вставок кода для вашего сайта на WordPress

smart.noreply@gmail.com

В данном уроке приводится 10 вставок кода для WordPress, которые могут облегчить труд блогера.

Поперечное проскальзывание материала при прокрутке страницы

smart.noreply@gmail.com

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

Эффект размытия пунктов списка

smart.noreply@gmail.com

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

PrefixFree: вариант выхода из ада префиксов

smart.noreply@gmail.com

Нет сомнений, что CSS3 отличный и мощный инструмент в руках разработчика. Но те, кто им пользуются попадают в ад префиксов.

Оригинальные эффекты при наведении курсора мыши на объекты

smart.noreply@gmail.com

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

Последовательный выбор с использованием AJAX, jQuery и PHP

smart.noreply@gmail.com

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

Симпатичные всплывающие подсказки

smart.noreply@gmail.com

В данном уроке мы сделаем всплывающие подсказки с использованием CSS3, HTML и jQuery.

Cоздаем простой плагин для WordPress

smart.noreply@gmail.com

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

Эффектный переключатель с использованием CSS3 и jQuery

smart.noreply@gmail.com

В данном уроке мы создадим плагин jQuery для представления глянцевого переключателя в качестве элемента управления на веб страницах. Названный knobKnob, данный плагин будет использовать трансформации CSS3 и новые методы jQuery для обработки событий, чтобы предоставить пользователю новый способ интерактивного выбора значения из доступного диапазона.

Автосохранение данных, введенных в поля формы

smart.noreply@gmail.com

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

Пишем тест кода PHP с помощью Testify.php

smart.noreply@gmail.com

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

Приятные всплывающие подсказки с использованием CSS3 и jQuery

smart.noreply@gmail.com

Очевидно, что всплывающие подсказки существенно улучшают удобство использования интерфейсом приложения. В данном уроке мы создадим практическое решение с применением CSS3 и jQuery.

Стильный индикатор прогресса на CSS3

smart.noreply@gmail.com

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

Стильная поисковая форма с использованием CSS3

smart.noreply@gmail.com

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

Практика использования CSS3 для оформления таблиц

smart.noreply@gmail.com

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

Выпадающее анимированное меню на CSS3

smart.noreply@gmail.com

Несомненно, что особенности CSS3 (трансформации и анимации) позволяют придать дизайну проекта более утонченный вид. В данном уроке мы построим анимированное выпадающее меню на CSS3 с некоторыми интересными эффектами.

Интерактивная карта с всплывающими подсказками

smart.noreply@gmail.com

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

Простая и эффективная выпадающая форма регистрации на сайте

smart.noreply@gmail.com

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

Навигационное меню на CSS3

smart.noreply@gmail.com

Навигационное меню является одним из важных элементов сайта. В данном уроке представлено привлекательное меню на CSS 3.

Помните про "transition: all"

smart.noreply@gmail.com

Небольшой совет, который может облегчить жизнь при работе с трансформациями CSS3.

Как встроить код HTML и CSS во фрейм

smart.noreply@gmail.com

Вы когда-нибудь пользовались сервисом, подобным JSBin? На нем можно написать код HTML, CSS и JavaScript, и тут же увидеть результат своих действий на специальной панели. В данном уроке мы сделаем страницу с элементом iframe, которая будет выполнять почти такие же действия (за исключением реализации JavaScript кода).

10 вставок кода jQuery

smart.noreply@gmail.com

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

Эффект размытия изображения с помощью HTML5

smart.noreply@gmail.com

С помощью элемента canvas можно размывать изображения при переходе от одного к другому, создавая отличный визуальный эффект. В уроке используется скрипт StackBlur, который выполняет быстрое размытие изображения по Гауссу.

9 лучших CMS

smart.noreply@gmail.com

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

Слайдер jQuery UI

smart.noreply@gmail.com

В данном уроке мы сделаем небольшой симпатичный слайдер с использованием jQuery UI.

Двойная рамка с использованием CSS

smart.noreply@gmail.com

Одним из занятных приложений свойства CSS3 box-shadow является создание двойной рамки вокруг элемента. Очень интересный эффект для оформления страниц, Но работать он будет только в новых версиях браузеров, которые поддерживают box-shadow. Однако существует еще несколько методов для создания такого эффекта. Причем очевидное использование фонового изображения является весьма далеким от идеала. В данном уроке представлены пять методов для создания двойной рамки вокруг элемента. Причем только один из них требует изображение, а все остальные используют чистый код CSS с отличной поддержкой в браузерах.

Центрируем неизвестное

smart.noreply@gmail.com

Когда приходится центрировать элементы в веб дизайне, информация о самом элементе и его родителе очень облегчает задачу. Ну а когда неизвестно ничего, что делать? Но задача имеет решение.

Размытое меню

smart.noreply@gmail.com

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

Пишем высококачественный JavaScript код. Часть 4 из 4

smart.noreply@gmail.com

Четвертая часть урока, посвященного методам создания JavaScript кода, который облегчит сопровождение проектов.

Эффект волны для галереи

smart.noreply@gmail.com

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

Пишем высококачественный JavaScript код. Часть 3 из 4

smart.noreply@gmail.com

Третья часть урока, посвященного коду JavaScript. Простые рекомендации для создания легко поддерживаемого проекта.

Анимированное выскальзывающее меню с использованием псевдоселекторов

smart.noreply@gmail.com

В данном уроке мы разберемся как создать меню с проскальзыванием пунктов при наведении на них курсора мыши. Сделаем три варианта: с использованием псевдоклассов CSS3, без псевдоклассов для обеспечения лучшей поддержки браузерами, и с помощью jQuery (вариант, пригодный для работы везде).

Пишем высококачественный JavaScript код. Часть 2 из 4

smart.noreply@gmail.com

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

7 советов по стратегии дизайна блога

smart.noreply@gmail.com

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

Пишем высококачественный JavaScript код. Часть 1 из 4

smart.noreply@gmail.com

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

Таблицы CSS лучше таблиц HTML?

smart.noreply@gmail.com

Многие веб мастера уверены, что использовать HTML таблицы в шаблонах - плохая практика. Но в данном уроке мы рассмотрим только таблицы CSS. Какая разница между таблицами HTML и CSS? Надо ли использовать таблицы CSS? Если да, то как?

Эффект передвижения слайдов на jQuery

smart.noreply@gmail.com

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

Креативное анимированное меню CSS3

smart.noreply@gmail.com

Эксперименты с CSS3 могут привести к замечательным эффектам, которые появляются при наведении курсора мыши. Идея заключается в простом сочетании элементов (иконки, основного и вспомогательного заголовков), которые анимируются и трансформируются при наведении курсора мыши. В уроке объясняется, что происходит с элементами.

10 с + инструментов для облегчения процесса работы с CSS3

smart.noreply@gmail.com

CSS3 привнес замечательные изменения в спецификацию CSS. C его помощью можно создавать великолепные эффекты на веб страницах без головной боли. В данном уроке представлены 10 с + инструментов для облегчения работы с CSS3.

Стикер для горячего предложения средствами CSS

smart.noreply@gmail.com

Очень интересные задачки возникают, когда пытаешься воспроизвести элементы дизайна с помощью кода. Отличная разминка для интеллекта - создание графических объектов командами CSS.

Специальная функция для загрузки логотипа по нажатию правой кнопки мыши

smart.noreply@gmail.com

Как часто вы нажимаете правую кнопку мыши, чтобы сохранить логотип веб сайта? А сколько раз в результате полученное изображение имело низкое разрешение? На многих сайтах содержится специальная страница с изображениями логотипа в высоком разрешении, но такие страницы бывает очень непросто найти.

12 эффектов для текста с использованием теней CSS

smart.noreply@gmail.com

Типографика является самой любимой игрушкой веб дизайнеров. CSS имеет в своем составе один очень интересный инструмент - text-shadow (тень текста), который на первый взгляд кажется достаточно простым, но с его помощью можно создать запоминающиеся эффекты, если подключить изобретательность и воображение.

10 вставок кода для файла .htaccess

smart.noreply@gmail.com

Файл .htaccess является сердцем веб сервера, который работает под управлением Apache. Именно здесь определяется реакция сервера на различные действия посетителя. в данном уроке приводится 10 с + приемов для использования в файле .htaccess.

Простая математическая игра

smart.noreply@gmail.com

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

12 плагинов jQuery для проигрывания аудио и медиа файлов

smart.noreply@gmail.com

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

9 вставок кода для WordPress

smart.noreply@gmail.com

В данном уроке приводится несколько коротких, но весьма полезных вырезок кода для WordPress.

Руководство по бесконфликтному включению JavaScript и CSS в WordPress

smart.noreply@gmail.com

При создании сайта под управлением WordPress вполне вероятно возникновение ситуации, когда код какой-нибудь библиотеки (например, jQuery) включается в код страницы дважды. Такое положение замедляет загрузку страниц и может привести к досадным, трудно обнаруживаемым ошибкам при работе скриптов.

Исключения PHP. Часть 2 из 2

smart.noreply@gmail.com

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

Адаптивный вертикальный аккордеон

smart.noreply@gmail.com

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

Исключения PHP. Часть 1 из 2

smart.noreply@gmail.com

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

Фотогалерея с использованием AJAX

smart.noreply@gmail.com

В данном уроке мы создадим простую галерею jQuery с использованием AJAX для загрузки изображений. Наборы картинок будут определяться в массиве JavaScript, что создает потенциал для использования такой галереи на динамических страницах.

Адаптивная галерея изображений

smart.noreply@gmail.com

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

Отличное портфолио на HTML5

smart.noreply@gmail.com

В данном уроке мы сделаем отличное портфолио на основе HTML5, jQuery и плагина Quicksand. Потенциально демонстрационное портфолио может быть существенно расширено без особых усилий.

Эффект всплывающей миниатюры для навигации

smart.noreply@gmail.com

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

Стили CSS3 для изображений

smart.noreply@gmail.com

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

Округленные стили изображений с помощью jQuery и CSS3

smart.noreply@gmail.com

В данном уроке мы разберемся как сделать скругленную стилизацию для картинок с помощью CSS3 и jQuery. Дело в том, что далеко не все браузеры корректно отображают свойства CSS3 border-radius и box-shadow. Но проблему можно решить с помощью тега span.

Установка и настройка модуля новостей для Joomla 1.7 AidaNews2 (Чaсть 2)

smart.noreply@gmail.com

В данном уроке мы научимся устанавливать и настраивать очень гибкий модуль для отображения новостей на Joomla 1.7

5 способов использовать виджеты WordPress

smart.noreply@gmail.com

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

Пишем собственное поисковое ядро. Часть 2.

smart.noreply@gmail.com

Продолжаем разработку нашего поискового ядра. В данном уроке мы напишем еще несколько функций и рассмотрим работу с шаблоном.

Пишем собственное поисковое ядро. Часть 1.

smart.noreply@gmail.com

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

Установка и настройка модуля новостей для Joomla 1.7 AidaNews2 (Часть 1)

smart.noreply@gmail.com

Идея: семантические анимации

smart.noreply@gmail.com

Анимации CSS являются замечательным инструментом в руках веб дизайнера. С их помощью можно создавать практически любые чудеса в окне веб браузера. Есть пара "но". Первое "но" - создание анимаций часто связано с использованием пустых элементов div, что выходит за рамки семантичности кода HTML. Второе "но" - не все браузеры поддерживают анимации. И пользователи таких программ видят перед собой пустое окно вместо великолепной динамической картины.

Эффект тасующихся символов на jQuery

smart.noreply@gmail.com

В данном уроке мы сделаем плагин jQuery, который тасует текст любого элемента DOM. Эффект можно использовать в заголовках, логотипах и слайдшоу.

Создаем иконку с помощью CSS3

smart.noreply@gmail.com

В данном уроке мы создадим иконку документа с использованием свойств CSS3. Для нее потребуется только один элемент HTML.

Закладки с правильным адресом URL

smart.noreply@gmail.com

Разберем плагин, который помогает создать отличные закладки, адаптирующиеся под содержание и выводящие правильный URL в адресной строке.

Структурные псевдо-классы и псевдо-элементы

smart.noreply@gmail.com

Данный урок является последним в серии, посвященной селекторам CSS. В первом уроке были рассмотрены селекторы атрибутов, во втором - комбинаторы и некоторые псевдо-классы. Завершим обзор селекторов разбором структурных псевдо-классов и псевдо-элементов.

Анимированный индикатор прогресса на jQuery

smart.noreply@gmail.com

В данном уроке мы создадим динамический анимированный индикатор прогресса на jQuery. Наверняка вам знаком виджет jQuery Progressbar. По умолчанию - это статический виджет без какой-либо анимации. Мы расширим его возможности и сделаем его динамическим. Результат нашего урока будет оформлен в виде плагина jQuery.

Комбинаторы и псевдо классы.

smart.noreply@gmail.com

Данный урок продолжает серию о селекторах CSS и будет посвящен комбинаторам и псевдо-классам.

Меню с выпадающими формами - FormBox

smart.noreply@gmail.com

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

Плагин jQuery для указания важных элементов страницы

smart.noreply@gmail.com

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

Используем медиа запросы CSS3 для определения ориентации экрана

smart.noreply@gmail.com

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

Цветная система простановки рейтинга

smart.noreply@gmail.com

Системы рейтинга используются достаточно широко на различных сайтах. В данном уроке мы создадим интерфейс такой системы с интерактивностью.

Как браузеры отображают рамки разного типа

smart.noreply@gmail.com

Вероятно, что вы часто используете свойство CSS border, и почти всегда border-style имеет значение “solid”, которое отображается одинаково во всех браузерах. Всем известно, что border-style может иметь другие значения, но их применяют очень редко. Наверняка, будет интересно посмотреть, как выглядят различные значения в разных браузерах.

Радиокнопки в двух группах ограничений

smart.noreply@gmail.com

Допустим, вам нужно разработать интерфейс, в котором пользователя надо ранжировать три категории по трем степеням оценки. С таким заданием вполне можно справиться с помощью радио кнопок.

Слайдшоу с эффектом всплывающих пузырьков

smart.noreply@gmail.com

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

6 методов вертикального центрирования с помощью CSS .

smart.noreply@gmail.com

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

Создаем колонки с помощью CSS3

smart.noreply@gmail.com

В данном уроке мы расскажем о использовании свойств CSS3 для построения многоколночного шаблона.

Добавляем на изображение водяной знак через PHP

smart.noreply@gmail.com

В данном уроке демонстрируется техника работы с библиотекой PHP GD. Основная цель - добавить водяной знак на исходное изображение и генерировать результат в виде PNG картинки на сервере. В качестве дополнения будет формироваться рамка вокруг изображения и добавляться текст.

А вы используете 7 селекторов атрибутов?

smart.noreply@gmail.com

Селекторы CSS являются значимым ингредиентом при разработке веб сайта. Они привязывают код CSS к разметке HTML. Сколько различных шаблонов селекторов вы регулярно используете?

Используем jQuery. 15 советов.

smart.noreply@gmail.com

В данном уроке приводится 15 рекомендаций по работе с библиотекой jQuery. Описанные методы помогают эффективно использовать мощный инструмент разработчика.

Отличная галерея на CSS3 и jQuery

smart.noreply@gmail.com

В данном уроке мы создадим отличную галерею изображений на CSS3 и jQuery (с комбинацией техники "перетащи-и-брось" и плагина fancybox). Фотографии будут разбросаны по поверхности экрана, их можно перетаскивать и открывать для просмотра.

Структура DOM в случае ошибок в разметке HTML

smart.noreply@gmail.com

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

Навигация с эффектом скольжения при смене категорий

smart.noreply@gmail.com

На странице с выбором продуктов компании Apple используется интересный эффект при смене категории. Если посмотреть исходный код страницы, то можно обнаружить, что Apple использует prototype.js - популярную до появления jQuery библиотеку JavaScript. В данном уроке мы воспроизведем эффект, применяя плагин jQuery Easing.

Плагин для работы с куками

smart.noreply@gmail.com

При создании различных веб приложений одним из популярных методов хранения информации являются куки. Плагин jQuery jCookies существенно облегчает работу с ними. Можно работать с различными данными: строками, массивами, объектами.

Только CSS: сворачивающееся выскакивающее окно

smart.noreply@gmail.com

Трюк с использованием скрытой радио кнопки или чекбокса, селектора псевдо класса :checked и комбинатора смежных элементов (~) открывает доступ к реализации различных эффектов на чистом CSS.

Только CSS: закладки с круглыми углами

smart.noreply@gmail.com

Скругленные углы очень просто сделать с помощью правила border-radius. Но оно ограничивает нас формой. А что если нам нужно соединить одну форму с другой с помощью внешних круглых углов?

Запускаем трансформации CSS3 из JavaScript

smart.noreply@gmail.com

Обычно трансформации CSS3 запускаются с помощью средств CSS, таких как псевдо-классы :hover или :checked. Такое положение соответствует изменению состояния элемента, для которого определены трансформации. Однако, трансформации CSS можно запускать и из JavaScript кода.

Сеточный шаблон и современные тенденции дизайна

smart.noreply@gmail.com

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

10 полезных коротких кодов для WordPress

smart.noreply@gmail.com

Короткие коды помогают сохранить время всем пользователям WordPress. Они позволяют выполнять сложные задачи простой вставкой кода с параметрами в текст записи. В данном уроке мы представляем 10 коротких кодов WordPress, которые увеличат вашу производительность.

Корзина покупок на jQuery

smart.noreply@gmail.com

В данном уроке мы создаем клиентскую часть корзины покупок с использованием jQuery. Управление вычислениями общего количества и суммы покупки будет осуществляться в JavaScript. Для формирования корзины покупок будет использоваться технология "перетащи-и-брось" с помощью библиотеки jQuery UI.

Семантическая модульная сетка для завтрашних шаблонов

smart.noreply@gmail.com

Библиотеки CSS для модульных сеток облегчают нашу жизнь. Но и в них есть недостатки. К счастью, новейшие техники предлагают свежие подходы к проектированию шаблонов.

Автоматический монтаж изображений

smart.noreply@gmail.com

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

Делаем простой 3-х колоночный шаблон

smart.noreply@gmail.com

На одном из предыдущих уроков мы разобрали процесс создания простого 2-х колоночного шаблона CSS. А сейчас продолжим тему создания шаблонов CSS и построим 3-х колоночную структуру страницы.

Делаем простой 2-х колоночный CSS шаблон

smart.noreply@gmail.com

В данном уроке демонстрируется процесс создания простого 2-х колоночного шаблона.

Только CSS: сообщение, выпадающее сверху экрана

smart.noreply@gmail.com

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

Заголовок сбоку от блока

smart.noreply@gmail.com

Сделаем заголовок для раздела сбоку. Причем, выравнивать его будем по левой стороне, а не по верху блока.

Улучшаем модульную сетку

smart.noreply@gmail.com

Какой бы библиотекой для модульной сетки вы не пользовались, у всех есть одна проблема - управление полем и отступом для последнего элемента

Закладки с использованием только CSS

smart.noreply@gmail.com

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

Меню с изображениями на jQuery

smart.noreply@gmail.com

В данном уроке мы сделаем простое и эффектное меню на jQuery с использованием изображений. Пункты меню будут оформлены в виде слайдов, которые будут отодвигаться при наведении курсора мыши.

Эффект перемещающихся прямоугольников

smart.noreply@gmail.com

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

Страница с тройным слайдшоу

smart.noreply@gmail.com

В данном уроке мы построим веб страницу, на которой используется три разных слайдшоу, которые объединены в один динамический элемент дизайна. Такой эффект отлично работает в портфолио дизайнера или фотографа. Для создания такой страницы понадобятся начальные знания HTML, CSS и jQuery.

Бесконечное слайдшоу на CSS3

smart.noreply@gmail.com

С помощью CSS3 можно творить удивительные вещи. Например, бесконечное слайдшоу.

Управление всплывающей информацией

smart.noreply@gmail.com

Изображения оживляют интерфейс веб проектов. Кроме того, при наведении курсора мыши на картинку может открываться дополнительная информация (например, автор изображения и ссылка на его блог). У этой, простой на первый взгляд, задачи, есть некоторые особенности, которые нужно учитывать при организации интерфейса.

Как создать плагин слайд шоу на jQuery

smart.noreply@gmail.com

Существуют сотни плагинов слайдшоу, от популярного Lightbox до продвинутого Galleria. Зачем создавать еще один? Наверняка вы используете подобный плагин на своем веб сайте. Неужели не интересно, как самому сделать такой замечательный инструмент. А свой код гораздо проще модифицировать и добавлять особенные фишки, если вдруг захочется развивать проект.

CSS3: значения space и round для свойства background-repeat

smart.noreply@gmail.com

В спецификации CSS3 широко известное свойство background-repeat имеет два новых значения (в дополнение к repeat, repeat-x, repeat-y, и no-repeat, которые хорошо известны в среде разработчиков): space и round. В данном уроке приводится описание использования данных значений и снимки экрана с соответствующими фонами, получившимися в результате.

Диагональное портфолио с вращением изображений

smart.noreply@gmail.com

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

Анимированное меню с выскальзывающим текстом и иконкой

smart.noreply@gmail.com

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

Неопределённое состояние чекбокса

smart.noreply@gmail.com

Некоторые полезные сведения о чекбоксе.

Вращающий слайдер на jQuery и CSS3

smart.noreply@gmail.com

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

JSON: основы использования

smart.noreply@gmail.com

JSON - простой, основанный на использовании текста, способ хранить и передавать структурированные данные.

Руководство по использованию технологии "перетащи-и-брось" на jQuery. Часть 2 из 2.

smart.noreply@gmail.com

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

Руководство по использованию технологии "перетащи-и-брось" на jQuery. Часть 1 из 2.

smart.noreply@gmail.com

Перетаскивание элементов интерфейса с помощью курсора мыши является, скорее всего, самым интуитивно понятным способом взаимодействия пользователя с вашим сайтом или приложением.

14 инструментов для проверки кросс браузерности сайта

smart.noreply@gmail.com

Может быть, в будущем все веб браузеры будут выводить HTML/CSS код одинаково и в соответствии со стандартами. Тогда кросс браузерная проверка станет не нужна. Но такие рассуждения все еще остаются фантастикой, и проверка вашего проекта в современных и старых версиях браузеров необходима.