Virtual DJ — это отличная программа, которая превратит Ваш персональный компьютер в продвинутую DJ-студию. Обладая превосходными инструментами микширования МР3 файлов в режиме реального времени, а также огромным количеством эффектов, специальных примочек, шаблонов и переходов. Но если вы хотели бы сделать муляж такого проигрывателя у себя на сайте, просто для того чтобы красочно преподнести посетителю музыку которая играет у вас на сайте, тогда этот урок вас заинтересует. В нем мы рассмотрим как сделать такой проигрыватель с помощью css3.

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

Шаг 1. HTML

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

Шаг 2. CSS

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

Материал взят из зарубежного источника. И представлен исключительно в ознакомительных целях. Музыка в плеере- Totally Enormous Extinct Dinosaurs – Garden.

Читайте также: