Как сделать кнопку «наверх» для сайта

Приветствую вас, друзья мои. Сейчас я освящу наверное один из самых популярных вопросов в области «быстрых рецептов» на html/css/js. А именно — создание кнопки «наверх», которая так часто встречается на самых различных ресурсах. И как обычно, пишу я это не просто так, а исходя из своего личного опыта, ибо вы можете заметить у меня такую кнопку в нижней правой части экрана.

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

HTML код кнопки «наверх»

Начать логичнее всего непосредственно с самой кнопки. Существует огромное количество вариантов, но я расскажу о самом визуально красивом способе нарисовать стрелочку на веб-странице — с помощью набора иконок Font Awesome.

читать далее «Как сделать кнопку «наверх» для сайта»

Загрузка файла через форму на PHP

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

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

HTML форма для загрузки файла

Первым делом построим самую простую форму с двумя полями: специальное поле для загрузки файла(input type=file), и кнопка «отправить». Методом отправки данных будет POST. Кроме того, необходимо указать способ кодирования данных при отправке, с помощью атрибута ecntype.

читать далее «Загрузка файла через форму на PHP»

Быстрая шпаргалка: как выровнять div по центру страницы

Ситуация, у нас есть блочный элемент div, например такой.

<div class="testdiv">
    <p>Привет</p>
</div>

Мы хотим поместить его ровнехонько в центр странички.

Первое решение, которое приходит в голову

<div class="testdiv" align="center">
    <p>Привет</p>
</div>

Аналогичное решение с помощью CSS

читать далее «Быстрая шпаргалка: как выровнять div по центру страницы»