Загрузка изображения на сервер с предварительным просмотром при помощи HTML5 Drag and Drop

Здравствуйте, уважаемые читатели XoZbloga! За последнее время я получил несколько предложений сделать урок, на тему загрузки изображений на сервер с предварительным просмотром. В этом уроке я попытаюсь разобрать данную тему, чтобы у Вас не осталось вопросов. Загрузка будет осуществляться с помощью HTML5 Drag and Drop (перетащил и бросил).

Особенности адаптивной верстки

Здравствуйте, уважаемые читатели XoZbloga! Когда говорят об адаптивной верстке, то подразумевают шаблон, который подстраивается под любое разрешение экрана. Элементам контейнерам div присваивается относительная ширина, правильное позиционирование и тд. Но также не следует забывать о содержимом этих контейнеров. Да, текст подстроиться по ширине автоматически, но как же быть с изображениями, видео и аудио элементами на странице. Ведь если где-то, что-то вылезает за пределы или торчит не в том месте — это не совсем хорошо.

Создаем аккордеон для сайта

Здравствуйте, уважаемые читатели XoZbloga! В этой статье разберем 3 способа создания аккордеона для сайта:

  • с помощью jQuery;
  • с помощью CSS3;
  • с помощью HTML5.

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

Текстовый редактор для сайта — wysihtml5

      HTML

Здравствуйте, уважаемые читатели XoZbloga! В этой статье расскажу Вам о wysihtml5 — текстовом редакторе для сайта с открытым исходным кодом. wysihtml5 использует сложные концепции безопасности и стремится создать правильную и чистую разметку HTML5, предотвращая добавление ненужных тегов и встроенных стилей, которыми так часто грешат другие текстовые редакторы. В тоже время очень быстрый и легкий в работе. Поддерживается даже речевой ввод для Chrome! Одним словом хороший текстовый редактор, который можно настроить для своих нужд!

Фотогалерея для сайта с использованием HTML5 Canvas

Здравствуйте уважаемые читатели XoZblogа! В этом уроке мы создадим фотогалерею для сайта с использованием HTML5 Canvas и CSS3. Смотрите демо-версию, чтобы оценить эффект при наведении на изображение. Оттенки серой «копии» основного изображения создаются с помощью Canvas, а также с CSS3 для плавного изменения «копии» на основное изображение. Советую также ознакомиться с уроком Галерея изображений на jQuery. Коротко о том, что такое Canvas. Спецификация HTML5 включает множество новых тегов, одним из которых является canvas.

Простые стили для горизонтальных линий, тег <hr />

      CSS, HTML

Привет! А Вы пользуетесь горизонтальными линиями (т.е. тегами <hr />), при верстке сайта? Если да, то эта статья для Вас! Конечно при желании можно придумать и реализовать, достаточно интересные линии, которые будут подходить именно Вашему проекту и вписываться в общий дизайн! Вот несколько простых CSS правил для горизонтальных линий.

6 новых методов, которые должен знать каждый веб-разработчик.

      CSS, HTML

Веб-разработчики всегда должны совершенствовать свои знания и изучать новые техники программирования, если они хотят «идти в ногу» со временем. Сегодня, я собираюсь показать Вам 6 свежих методов веб-разработки, что определенно следует знать, или улучшать, если Вы их уже знаете.