плееры-кнопки - Самое интересное в блогах

bloginja

Оформляем плеер картинкой

Среда, 17 Июля 2024 г. 15:10 (ссылка)

Оформляем плеер картинкой - линеечкой или картинкой - кнопкой.

Имеем такой плеер:

КОД ПЛЕЕРА:

Здесь в теге opacity:1; заменена единица на ноль. Это делает плеер невидимым.
Скопируйте код в Новую запись.

Будем его украшать. Закроем этот плеер картинкой. Для этого заключим этот код в формулу фона - картинки.

Копируем часть формулы до слов КОД ПЛЕЕРА и вставляем в начало кода в Новой записи.
вставить 1 (600x374, 61Kb)

Затем скопировать закрывающие теги после слов КОД ПЛЕЕРА и вставить в конец записи.
вставить 2 (600x369, 72Kb)

Теперь вставим картинку плеера, подставим значения размеров картинки.
Вставляем музыку мр3. Получаем такой плеер - линеечку:

Можно в коде плеера менять картинку с её размерами и получать новый плеер.
А можно его немного изменить:

--------------------------------------------
С плеерами - кнопками немного сложнее.
Тут не обойтись без редактора. Я пользуюсь Paint.net.
Нужно создать картинку на прозрачном фоне. Например, такую

Это очень просто: Создать - Указать размер - Правка - Выделить все - Очистить выделение.
Файл - Открыть - Выбрать картинку плеера - Открыть - Правка - Копировать - Вставить.

КОД ПЛЕЕРА - КНОПКИ такой же.

Подставляйте значения и готово.

Примеры:

УДАЧИ!

Bloginja