Урок по созданию плеера из картинок в gif и png формате
26-03-2021 12:49
к комментариям - к полной версии
- понравилось!
Это цитата сообщения Mariea Оригинальное сообщение
Это цитата сообщения Mariea Оригинальное сообщение
Плеер из гиф-картинки Несколько дней пыталась сделать пост с такими маленькими, похожими на флеш плеерами. Причем видела, что у многих они классно получаются и звучат. У меня же ни в какую не включались. Я думала может браузер виноват, но ведь некоторые все-же включались. В общем, изучив посты и уроки от Valera, gazh, Luba_G, Imenitaya, Marina-Rozina, я таки сделала свой флеш-плеер. Очень подробный урок на эту тему у Marina-Rozina. Обязательно познакомтесь с ним, он многое обьясняет в самом построении плеера. Также много полезного вы найдете в уроке от Luba_G в СОО "Аудио плееры". В своем уроке я хочу вам рассказать, как я сделала свой плеер в фотошопе и как затем оформила его для поста на li ru. 1.В фотошоп загружаем выбранную картинку, она может быть как в gif, так и в png формате. В gif желательно подобрать не очень многослойную анимацию, в крайнем случае, можно сократить слои-кадры.  2.Изображение - Размер холста. Загружаемое нами изображение в gif формате имеет размеры 45 на 45 пикс.  3.Изображение - Размер холста. Добавим справа 66 пикс. по ширине и 6 пикс. по высоте.  Делаем это из расчета, что плеер должен быть не менее 50 пикс. по высоте и 90-120 пикс. по ширине, иначе он будет неоднократно повторяться на плоскости, отведенной для плеера. Об этом подробно описано в уроке Марины-Розина. Можно было добавить 65 и 5 пикселей для округления, но я добавила числа кратные двум, чтобы в плеере со всех сторон добавилось равномерное количество прозрачных пикселей. 4.Мы создали новый плеер на прозрачной основе размером 51 на 111 пикс.  5.Файл - Сохранить для Web и устройств  Сохраняем наш плеер в gif, можно и в png.6.В итоге мы получили плеер на прозрачной основе размером 51 на 111 пикс. в формате gif. 7.Желательно загрузить его на какой-нибудь из своих хостингов и, взяв оттуда соответствующий код, вставить его в формулу для плеера в своем посте на li ru. 8.Формула музыкального поста с плеером на прозрачной основе. При наведении на плеер проявляется надпись "Play/Pause", нажав на которую плеер включается или выключается. В любом случае, нажимайте смело, теперь-то он точно зазвучит.  Благодарю всех за помощь. Пусть будет больше плееров больших и маленьких! И пусть музыка звучит! P.S.: Можно собрать этот плеер по указанной формуле и без фотошопа, без хостинга, но в этом случае не всегда и не во всех браузерах он будет играть, и нет уверенности, что в какой-то момент не исчезнет совсем. |
Вы сейчас не можете прокомментировать это сообщение.
Дневник Урок по созданию плеера из картинок в gif и png формате | Астраханочка_51 - Дневник Елены |
Лента друзей Астраханочка_51
/ Полная версия
Добавить в друзья
Страницы:
раньше»