...Рамочка с бегущим текстом ... Урок от Татьяны Егоровой.

Пятница, 06 Января 2017 г. 23:05 + в цитатник

Цитата сообщения Егорова_Таня

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

.БЕГУЩИЙ ТЕКСТ
Попросили сделать урок с таким вот бегущим текстом как в рамочке ниже

рамочка от Егоровой Татьяны..................................................коллаж от Sabine Astana

Здесь будет Ваш текст

Код этой готовой рамочки

<table style="border:8px ridge #990000" background="//img0.liveinternet.ru/images/attach/c/10/126/936/126936420_3c274277008c.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:10px"><center><b><a target="_blank" href="http://www.egorovatatiana.ru/"><font color="#f5989d"><font size="1">рамочка от Егоровой Татьяны</font></font></a><font color="#9d0039"><font size="1">..................................................</font></font><a target="_blank" href="//www.liveinternet.ru/users/3111237/"><font color="#f5989d"><font size="1">коллаж от Sabine Astana</font></font></a></b><table style="border:3px ridge #cc9900" background="//img1.liveinternet.ru/images/attach/c/10/126/936/126936421_c42e0dfbbed9.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:15px"><table style="border:3px ridge #990000" background="//img0.liveinternet.ru/images/attach/c/10/126/936/126936420_3c274277008c.jpg" cellspacing="0" cellpadding="0"><tr><td style="padding:5px"><table width="570" height="398" style="border:0px none #000000" background="//img0.liveinternet.ru/images/attach/c/10/126/936/126936490_2571c09b69bf.gif" cellspacing="0" cellpadding="0"><tr><td style="padding:10px" zzz="zzz" align="center"><table border="0" cellspacing="0" cellpadding="0"><tr><td style="padding:1px" align="center"><table width="230" border="0" cellspacing="0" cellpadding="0"><tr><td align="center"><span style="color:#000000;font-size:20px"><b></b></span></td></tr></table></td><td style="padding:1px" align="center"><table width="305" height="360" style="border:0px none #000000" background="//img1.liveinternet.ru/images/attach/c/10/126/936/126936515_cd50c0bd81c7.png" cellspacing="0" cellpadding="0"><tr><td style="padding:10px" zzz="zzz" align="center"><span style="font-family:Verdana;color:#000000;font-size:12px"><b><marquee width="245" height="290" scrolldelay="0" direction="up" scrollamount="1" style="background: ; padding: 0px; border: 0px aeca7d;"><center><font color="#000000"><font size="2"><b><br />
Здесь будет Ваш текст</b></font></font></center></marquee></b></span></td></tr></table></td></tr></table></td></tr></table></td></tr></table></td></tr></table></center></td></tr></table>

Уроков на эту тему в других дневниках много, но наверно ничего страшного, если появится еще один.

Заставить двигаться можно не только текст, но и картинки, ссылки и всё, что будет вложено в "бокс" с этими тегами.

Даю как всегда "скелетики" кода. Расскажу как их применять.
Копируем код из окошечка. Вставляем его в нужное место. Например в рамку. И видим тот или иной код (см. фото А и Б)

Вместо моих слов пишем нужные параметры.
Вместо слова ШИРИНА вписываем ширину, на которую будет растянут текст. Вместо ВЫСОТА свой параметр откуда будет появляться текст и где исчезать. Это нужно, чтобы текст не "вылезал" за рамку. Примерные размеры от 200 до 650. Ставите путем подбора.

СКОРОСТЬ. От 1 до 5. Чем выше цифра, тем быстрее передвигается текст. Лучше всего поставить 1.
ЦВЕТ и РАЗМЕР ШРИФТА-думаю тут всё понятно. Цвет-это 6 знаков кода цвета, размер от 6 до 30. Чаще всего ставится 13-23.

Так же можно поменять и стиль шрифта. В коде указан самый распространенный Verdana (см. фото А-1), но можно поменять на другой.

В коде бегущего текста на цветном фоне всё как и в коде текста на прозрачном фоне, только прибавился параметр ЦВЕТ ФОНА (см. фото Б). И можно сделать шире, тоньше или совсем убрать обводочку. В коде стоит значение 2 (см. фото Б-1). Эту цифру можно сделать больше или меньше. Тогда изменится толщина обводки. Если поставить ноль, она исчезнет.

БЕГУЩИЙ ТЕКСТ НА ПРОЗРАЧНОМ ФОНЕ

Здесь будет Ваш текст

БЕГУЩИЙ ТЕКСТ НА ЦВЕТНОМ ФОНЕ

Здесь будет Ваш текст

В МИРе этот код не пройдет.
Удачи!
еще разные уроки здесь

Серия сообщений "________ - Делаем рамочки -":
Часть 1 - Делаем рамочку для текста без ФШ...
Часть 2 - Учимся делать рамочки (вникаем в суть)... Урок № 1 от bloginja...
...
Часть 4 - Рамочки в 1 слой...
Часть 5 - РАМОЧКИ ВОКРУГ ТЕКСТА (С РАЗРЫВОМ)
Часть 6 - ...Рамочка с бегущим текстом ... Урок от Татьяны Егоровой.
Часть 7 - Рамочка для текста с анимированным фоном без помощи ФШ.....
Часть 8 - Рамочки для текста с разноцветными бордюрами
...
Часть 18 - Поговорим о рамочке для текста "Рамочка-книжка"
Часть 19 - *** ДВЕ рамочки с вертикальными бордюрами...
Часть 20 - И снова — «Рамочка-книжка»