16 октября 2012 г.

Как сделать бегущую строку?

К анимации всегда отношусь настороженно, с ней ведь так легко переборщить.

Для себя принимаю три вида анимации - баннеры с меняющимися (небыстро) картинками, смена картинки при наведении курсором и бегущую строку.

Сегодня расскажу вам о том, как добавить в блог бегущую строку.

Я пробовала у себя добавлять, мне не понравилось, а вот Ира добавила ее в боковую колонку - и мне понравился эффект, поэтому я и решила написать об этом.

Делаем:


1. При создании нового сообщения переходим в режим HTML и вставляем код бегущей строки.

Сам код бегущей строки выглядит так:




В режиме Создать вы не увидите движение строки, а вот если нажать на Просмотр, то получится вот такая бегущая строка:

Текст двигается справа налево

2. Можем настроить бегущую строку так, как нам надо.

Выбираем направление движения. Для этого используем вот эти теги:

direction="left" - влево
direction="right" - вправо
direction="up" - вверх
direction="down" - вниз


Например, мы хотим, чтобы текст чучухал слева направо, пишем вот такой код:


Жмем на Просмотр и видим, что строчка поехала вправо:

Текст двигается слева направо


Задаем "поведение" движения:

behavior="alternate" - текст двигается вправо до конца, а потом в обратном направлении
behavior="slide" - текст останавливается в конце строки
loop="4" - время показывания текста в секундах
scrollamount="2" - скорость движения, чем больше значение, тем быстрее


Делаем текст красивым))

width="300" - ширина поля движения текста 300 px
height="100" - высота поля движения текста 100 px
style="color: #000000" - цвет текста
bgcolor="#66FFCC" - цвет фона
bgcolor="style="font-family: Verdana" - тип шрифта
style="font-size: 11pt" - размер шрифта
style="font-size: 11pt; color:
#000000; font-family: Verdana"
- задаем в одном теге тип, размер и цвет шрифта

Коды цветов можно скопировать вот здесь.

Если нам надо объединить несколько параметров пишем так:



Здесь пишем текст бегущей строки


Можем вставить картинку.

Тогда на место текста бегущей строки вставляем код картинки:



Параметры движения картинки тоже можем задавать.

Когда я читала о бегущей строке в интернете, то нашла интересный блог: Азбука блоггера

Нажав на ссылку , вы перейдете на пост, посвященный созданию бегущей строки.  Там же есть автоматический генератор кода строки (в самом низу поста). Можно воспользоваться им, очень удобно!!!
И вообще блог классный, посмотрите - в нем много полезного для нас начинающих программистов))))


13 комментариев :

  1. Лена, спасибо большущее за то, что тратишь свое время, чтобы объяснить нам, чайникам, такие вещи!

    ОтветитьУдалить
  2. Лена! Ну что бы мы без тебя и твоих очень умных мозгов делали?
    Мой муж очень плотно работает с компьютерами и всякими програмульками, но как у сапожника без сапог, до моего блогаего длинные руки не доходят.
    спасибо тебе, дружище!!

    ОтветитьУдалить
  3. Лена, спасибо за посты по блоговедению, очень нужная информация.

    ОтветитьУдалить
  4. Лена спасибо!
    очень полезная информация, пошла пробовать ;)

    ОтветитьУдалить
  5. Лена, спасибо вам!
    Вы не только великолепные сумки делаете, но о интересных и полезных фишках для блога пишите :)

    ОтветитьУдалить
  6. Давно на "Азбуке" сижу - оч. люблю страницу с таблицей цветов! :))

    ОтветитьУдалить
  7. Спасибо большое, у Вас всегда очень полезные уроки. Может в будущем его применю:))

    ОтветитьУдалить
  8. Вот это да!!! Оказывается, все так просто (особенно, когда знаешь)))) Лена, спасибо за подсказку и МК!!!

    ОтветитьУдалить
  9. А как делать на главной странице?

    ОтветитьУдалить
  10. А как сделать так, что бы было видно только текст без символов? Спасибо

    ОтветитьУдалить
  11. الحشرات تشير الحشرات إلى الآفات وناقلات الأمراض كالبق والعناكب وعث الملابس والمن والخنافس والبعوض والبراغيث والدبابير والنحل والنمل والفراشات وغيرها الكثير، تعد عضوًا لفئة تسمى والتي تنتمي إلى animal phyla، تمتاز بصغر حجمها واجسامها المجزأة وأرجلها المفصليِّة وهياكلها الخارجيّة العظميِّة، يمكن تمييزها عن غيرها من المفصليات عن طريق أجسامها المقسمة إلى 3 مناطقٍ رئيسةٍ؛ الرّأس والصّدر والبطن، بالرّغم من اعتبار الإنسان الحشرات مفيدًة جدًّا لدورها في تلقيح النباتات واستخدامها في تطبيق العديد من الدّراسات البيولوجيّة والعمليات الفسيولوجيّة إلّا أن الكثير من يبحث عن طرق للتخلّص ولمكافحتها في المنازل، لذلك في هذا المقال سيتم التعرِّف على طرق مكافحة حشرات المنزل وبعض النّصائح والتوجيهات التي تسهم في منع ظهورها.
    شركة مكافحة النمل الابيض بالرياض
    شركة مكافحة صراصير بالرياض
    شركة تنظيف منازل بالخرج
    شركة تنظيف فلل بالرياض

    ОтветитьУдалить
    Ответы
    1. great post, Hey there! I’m at work surfing around your blog from my new apple iphone! homework assignment help Just wanted to say I love reading through your blog and look forward to all your posts! Keep up the outstanding work!

      Удалить

Спасибо за Ваш комментарий! ❤️