Как сделать бегущий текст на картинке, без всякого редактора

Понедельник, 27 Октября 2014 г. 16:51 + в цитатник

Цитата сообщения Шадрина_Галина

Прочитать целиком В свой цитатник или сообщество!

В этом уроке я покажу как сделать бегущий текст на картинке, не прибегая ни к каким редакторам! Выглядит это вот так.

Падают с ветки

Жёлтые монетки…

Под ногами целый клад!

Это осень золотая

Дарит листья

Не считая...

Золотые дарит листья

дарит листья Вам, и нам,

И всем подряд.

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

<table height="ВЫСОТА КАРТИНКИ" cellpadding="10" width="ШИРИНА КАРТИНКИ" align="center" background="АДРЕС КАРТИНКИ" border="0" table="0"> <tbody><tr><td><marquee scrollamount="2" direction="up" height="ВЫСОТА ДВИЖЕНИЯ ТЕКСТА"> <center> 1-я строчка 2-я строчка 3-я строчка 4-я строчка 5-я строчка 6-я строчка 7-я строчка 8-я строчка 9-я строчка </center></marquee></td></tr></tbody></table>

Картинка здесь выступает ВМЕСТО ФОНА, поэтому на нее можно ставить все, что хотите, главное правильно поставить РАЗМЕР КАРТИНКИ.
Рассмотрим эту формулу более подробно. Выглядит она вот так.

Теперь начинаем подставлять в нее свои значения.
Вместо слов АДРЕС КАРТИНКИ, поставляем адрес своей картинки (если с картинка с радикала, то код N1, если с ЯНДЕКС фото, то берете адрес там, а если картинка из интернета, то просто встаете мышкой на картинку, нажимаете правую кнопку мыши и выбираете КОПИРОВАТЬ АДРЕС КАРТИНКИ)

Вместо слов ВЫСОТА КАРТИНКИ, ШИРИНА КАРТИНКИ, подставляете размеры своей картинки в пикселях. (Размер картинки всегда можно взять в ее свойствах. Встаете на картинку мышкой, жмете правую кнопку, и выбираете ИНФОРМАЦИЯ ОБ ИЗОБРАЖЕНИИ)

Вместо слов ВЫСОТА ДВИЖЕНИЯ ТЕКСТА, ставите ВЫСОТУ КАРТИНКИ, или тот размер, на который вы хотите видеть бегущий текст.

Ну а вместо строчек вставляете свой текст. Лишние строчки можно просто стереть, или наоборот добавить новые, если требуется.

Теперь код нашей картинки выглядит вот так

Где
height="530" - высота картинки НУЖНО МЕНЯТЬ НА СВОЮ.
width="500" - ширина картинки, НУЖНО МЕНЯТЬ НА СВОЮ.
marquee scrollamount="2" - Скорость прокрутки текста (МОЖНО МЕНЯТЬ)
height="500" - Высота движения текста. (можно по высоте картинки, можно меньше)
[br /] расстояние между строчками текста. Чем БОЛЬШЕ вы поставите [br /], между строчками, тем большее расстояние будет между ними, то есть строчки будут опускаться вниз. Обычно ставится одна или две.
Текст редактируется как обычно. Перед первой строчкой текста ставите цвет, размер и расположение текста.

Если убавить ВЫСОТУ ДВИЖЕНИЯ ТЕКСТА, то текст будет двигаться только по этой высоте (то есть не во всю картинку). И выглядеть это будет ВОТ ТАК.

Вода в стремительном потоке,

Мой завораживает взгляд.

Реки, живительные соки,

Бросает в бездну водопад.

Текст можно писать любой длины, то есть количество строчек можно добавлять, или наоборот убирать. Это зависит от того, что вы хотите написать на своей картинке.

Ох, понедельник…вот взял и пришёл,

Можно подумать его кто-то звал!

Кучу проблем за собою привёл,

Всех загрузил и работой достал!

ДОБРОЙ РАБОЧЕЙ НЕДЕЛИ ВСЕМ!

К тексту можно добавить небольшие картинки, если вы хотите как то его украсить, например создавая красивое приветствие или поздравление. Код картинки ставьте прямо перед текстом (тогда она будет вначале текста). Или в конце текста (картинка будет сразу за текстом) Выглядеть это будет ВОТ ТАК.

Приятного осеннего дня

Для новичков, кому трудно составить такой код, я его пропишу вот в этом окошечке.

<table height="ВЫСОТА КАРТИКИ" cellpadding="10" width="ШИРИНА КАРТИНКИ" align="center" background="АДРЕС КАРТИНКИ" border="0" table="0"> <tbody><tr><td><marquee scrollamount="2" direction="up" height="ВЫСОТА КАРТИНКИ"> <center> HTML КОД КАРТИНКИ. ВАШ ТЕКСТ. HTML КОД КАРТИНКИ </center></marquee></td></tr></tbody></table>

Если вы хотите вставить только картинки (Т.е. просто картинки, или красивый текст, в виде картинки), то просто вместо строчек текста, ставьте HTML коды картинок. Выглядит это вот так.

Красивой вам ОСЕНИ

Выглядит в кодах это вот так

Где красным выделен код первой картинки (вместо первой строчки)
Голубым - код второй картинки (вместо второй строчки)
Зеленым - код третьей картинки и +текст (вместо третьей строчки)

Вот и все. Успехов в вашем творчестве!

Серия сообщений "уроки-текст":
Часть 1 - Нужные формулы для дневника
Часть 2 - Как в сообщении сделать красивый текст
...
Часть 5 - Двигающийся текст
Часть 6 - Русские шрифты.
Часть 7 - Как сделать бегущий текст на картинке, без всякого редактора
Часть 8 - Как разделить текст на 2 части.
Часть 9 - Как отступить от края записи
...
Часть 13 - Как печатать разные символы
Часть 14 - Символы - иероглифы
Часть 15 - Непонятные, но симпатичные

Понравилось: 1 пользователю

<a href="https://www.liveinternet.ru/users/5179239/post341426852/">РљР°Рє СЃРґРµР»Р°С‚СЊ Р±РµРіСѓС‰РёР№ С‚РµРєСЃС‚ РЅР° РєР°СЂС‚РёРЅРєРµ, Р±РµР· РІСЃСЏРєРѕРіРѕ СЂРµРґР°РєС‚РѕСЂР°</a> Р’ СЌС‚РѕРј СѓСЂРѕРєРµ СЏ РїРѕРєР°Р¶Сѓ РєР°Рє СЃРґРµР»Р°С‚СЊ Р±РµРіСѓС‰РёР№ С‚РµРєСЃС‚ РЅР° РєР°СЂС‚РёРЅРєРµ, РЅРµ РїСЂРёР±РµРіР°СЏ РЅРё Рє РєР°РєРёРј СЂРµРґР°РєС‚РѕСЂР°Рј! Р’С‹РіР»СЏРґРёС‚ СЌС‚Рѕ РІРѕС‚ С‚Р°Рє.

РџР°РґР°СЋС‚ СЃ РІРµС‚РєРёР–С‘Р»С‚С‹Рµ РјРѕРЅРµС‚РєРёвЂ¦РџРѕРґ РЅРѕРіР°РјРё С†РµР»С‹Р№ РєР»Р°Рґ!РС‚Рѕ РѕСЃРµРЅСЊ Р·РѕР»РѕС‚Р°СЏР”Р°СЂРёС‚ Р»РёСЃС‚СЊСЏРќРµ СЃС‡РёС‚Р°СЏ...Р—РѕР»РѕС‚С‹Рµ РґР°СЂРёС‚ Р»РёСЃС‚СЊСЏ
РґР°СЂРёС‚ Р»РёСЃС‚СЊСЏ Р’Р°Рј, Рё РЅР°Рј,Р РІСЃРµРј РїРѕРґСЂСЏРґ.
 
РЎРґРµР»Р°С‚СЊ СЌС‚Рѕ РЅРµ СЃР»РѕР¶РЅРѕ, РЅР°РґРѕ РїСЂРѕСЃС‚Рѕ РІР·СЏС‚СЊ РІРѕС‚ С‚Р°РєСѓСЋ С„РѕСЂРјСѓР»Сѓ. (РџРѕС‚СЏРЅРёС‚Рµ Р·Р° РїСЂР°РІС‹Р№ РЅРёР¶РЅРёР№ СѓРіРѕР»РѕС‡РµРє, Рё С„РѕСЂРјСѓР»Р° РІР°Рј РѕС‚РєСЂРѕРµС‚СЃСЏ РїРѕР»РЅРѕСЃС‚СЊСЋ.

1-СЏ СЃС‚СЂРѕС‡РєР°2-СЏ СЃС‚СЂРѕС‡РєР° 3-СЏ СЃС‚СЂРѕС‡РєР°4-СЏ СЃС‚СЂРѕС‡РєР°5-СЏ СЃС‚СЂРѕС‡РєР°6-СЏ СЃС‚СЂРѕС‡РєР°7-СЏ СЃС‚СЂРѕС‡РєР°8-СЏ СЃС‚СЂРѕС‡РєР°9-СЏ СЃС‚СЂРѕС‡РєР°

РљР°СЂС‚РёРЅРєР° Р·РґРµСЃСЊ РІС‹СЃС‚СѓРїР°РµС‚ Р’РњР•РЎРўРћ Р¤РћРќРђ, РїРѕСЌС‚РѕРјСѓ РЅР° РЅРµРµ РјРѕР¶РЅРѕ СЃС‚Р°РІРёС‚СЊ РІСЃРµ, С‡С‚Рѕ... <a href="https://www.liveinternet.ru/users/5179239/post341426852/">Р§РёС‚Р°С‚СЊ РґР°Р»РµРµ...</a>

Комментировать

« Пред. запись — К дневнику — След. запись »

Страницы: [1] [Новые]

СА-МАРА обратиться по имени Понедельник, 27 Октября 2014 г. 19:51 (ссылка)

Танечка привет у тебя нет урока или формулы на кликабальную подпись!!!!!!!

Ответить С цитатой В цитатник

Понедельник, 27 Октября 2014 г. 19:55ссылка

Татьяна_Н-ва

КЛИКАБЕЛЬНАЯ КАРТИНКА
<a target="_blank" href="АДРЕС из Радикала ссылка №1"><img src="АДРЕС из Радикала ссылка №1" width="100" height="100" border="0" /></a>

КЛИКАБЕЛЬНАЯ СТРОКА
<a href="АДРЕС метки" target="_blank">Строка</a>

Ответить С цитатой В цитатник Обратиться по имени

Понедельник, 27 Октября 2014 г. 19:59ссылка

Татьяна_Н-ва

жми внизу "с цитатой" ( как раньше в блоге) и копируй.

Ответить С цитатой В цитатник Обратиться по имени