С Новым годом! Форум программистов, компьютерный форум, киберфорум
JavaScript
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
 
Рейтинг 4.96/47: Рейтинг темы: голосов - 47, средняя оценка - 4.96
0 / 0 / 0
Регистрация: 12.10.2015
Сообщений: 32

Двигающийся текст

12.10.2015, 23:28. Показов 9991. Ответов 22
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Создайте страничку, на которой по основному тексту "проплывает" Ваше имя. Алгоритм движения: текст начинает двигаться по заданной траектории; через некоторое время текст меняет направление движения, доходит до исходного положения и все повторяется
0
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
12.10.2015, 23:28
Ответы с готовыми решениями:

Плавно двигающийся блок
http://vkontakte.ru/developers.php - На этой страничке вконтакте реализована следующуая технология при нажатии на кнопку плавно...

Создать двигающийся 3D текст
Народ, помогите пожалуйста. Немного разбираюсь в С\C++. Надо написать прогу, которая бы отображала двигающийся и крутящийся текст. С чего...

OpenGL, двигающийся текст
Как возможно задать движение тексту, взятому из файла, из верхнего правого угла в нижний левый+отобразить его отскакивание от границы? На...

22
супермизантроп
Эксперт JS
3941 / 2979 / 692
Регистрация: 18.04.2012
Сообщений: 8,629
13.10.2015, 02:03
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<style>
#myName {position: absolute; top: 123px; font-size: 64px; font-weight: bold}
</style>
<script>
var start = 23;
var final = 654;
var dir = 1;
var pos = start;
function moveName ()
{
pos += dir;
if (pos == start || pos == final) dir *= -1;
document.getElementById ('myName').style.left = pos + 'px';
setTimeout (moveName, 10);
}
onload = moveName;
</script>
<body>
<div id="myName">Sergilonio</div> 
</body>
0
0 / 0 / 0
Регистрация: 12.10.2015
Сообщений: 32
13.10.2015, 06:48  [ТС]
Движение должно быть таким: в правый верхний угол, затем горизонтально в левый, затем в правый нижний угол.
0
супермизантроп
Эксперт JS
3941 / 2979 / 692
Регистрация: 18.04.2012
Сообщений: 8,629
13.10.2015, 12:27
Цитата Сообщение от Sergilonio Посмотреть сообщение
Движение должно быть таким: в правый верхний угол, затем горизонтально в левый, затем в правый нижний угол.
вообще-то вам изначально следовало это указать

укажите теперь и "исходное положение" - т.е. "откуда именно надо начинать движение в правый верхний угол"?

а то я размещу там, где мне захочется, а вас это опять не устроит
0
0 / 0 / 0
Регистрация: 12.10.2015
Сообщений: 32
13.10.2015, 16:41  [ТС]
Из левого нижнего угла.
0
супермизантроп
Эксперт JS
3941 / 2979 / 692
Регистрация: 18.04.2012
Сообщений: 8,629
14.10.2015, 00:11
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
<style>
html, body {height: 100%; overflow: hidden}
p {margin: 45px}
#myName {position: absolute; z-index: 5; font-size: 64px; font-weight: bold; color: red}
</style>
<script>
onload = function ()
{
with (document.body) var W = clientWidth, H = clientHeight;
var obj = document.getElementById ('myName');
with (obj) var w = offsetWidth, h = offsetHeight;
 
var P = [{'x' : 0    , 'y' : H - h},
         {'x' : W - w, 'y' :     0},
         {'x' :     0, 'y' :     0},
         {'x' : W - w, 'y' : H - h}];
var j = 0;
var L = P [0].x;
with (obj.style) left = P [0].x + 'px', top = P [0].y + 'px';
   function move ()
   {
   if (L == P [j + 1].x) {j++; if (j == 3) P.reverse (), j = 0}
   else
      {
      L += (P [j + 1].x > P [j].x) ? 1 : -1;
      var A = P [j].y - P [j + 1].y,
          B = P [j].x - P [j + 1].x,
          C = P [j].x * P [j + 1].y - P [j + 1].x * P [j].y,
          T = Math.ceil ((A * L + C) / B);
      with (obj.style) left = L + 'px', top = T + 'px';
      } 
   setTimeout (move, 2);
   }
move ();
}
</script>
 
<body>
<div id="myName">Sergilonio</div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<hr>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<hr>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<hr>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<hr>
</body>
http://codecenter.awardspace.com/movetext.html
1
14.10.2015, 00:11

Не по теме:

Цитата Сообщение от kalabuni Посмотреть сообщение
[[[[[[[[[[[[[[[[[[[[[[[
это к чему?
код-то рабочий

0
супермизантроп
Эксперт JS
3941 / 2979 / 692
Регистрация: 18.04.2012
Сообщений: 8,629
14.10.2015, 00:15
Цитата Сообщение от BANO Посмотреть сообщение
это к чему?
код-то рабочий
вы это о чём?
0
14.10.2015, 00:23

Не по теме:

kalabuni, знаю такой прикол, сам пользуюсь, только вот меня на нём не палили

0
14.10.2015, 00:34

Не по теме:

Цитата Сообщение от BANO Посмотреть сообщение
знаю такой прикол, сам пользуюсь, только вот меня на нём не палили
потому что нет у вас такого "хвостика", как есть вы у меня :)

0
0 / 0 / 0
Регистрация: 12.02.2015
Сообщений: 7
21.12.2015, 19:45
Здравствуйте! Помогите пожалуйста с заданиями.
1. Создайте страничку, на которой по основному тексту "проплывает" Ваше имя. Алгоритм движения: текст двигается по заданной траектории; через некоторое время текст "скачком" возвращается в исходное положение и все повторяется.
Движение: Из нижнего правого угла в верхний левый, далее в просто вниз, далее в верхний правый угол.
2. Создайте страничку, на которой по основному тексту "проплывает" Ваше имя. Алгоритм движения: текст начинает двигаться по заданной траектории; через некоторое время текст меняет направление движения, доходит до исходного положения и все повторяется.
3. Создайте страничку, на которой по основному тексту "проплывает" ваше имя. Алгоритм движения: текст должен двигаться по косинусоиде сверху вниз и "скачком" возвращаться в исходное положение.
4. Создайте страничку, на которой по основному тексту "проплывает" Ваше имя. Алгоритм движения: текст должен двигаться по косинусоиде сверху вниз, затем менять направление движения; в исход¬ном положении все повторяется заново.
5. Создайте страничку, на которой по основному тексту "плавает" Ваше имя. Управление движением — при помощи экранных кнопок.
6. Создайте страничку, на которой по основному тексту "плавает" Ваше имя. Управление движением — при помощи кнопок клавиатуры.
7. Создайте страничку, на которой по основному тексту можно перетаскивать мышью Ваше имя.
8. Создайте страничку, на которой "Ваше имя" преследует курсор мыши.
9. Создайте страничку, на которой "Ваше имя" убегает от курсора мыши.
Буду очень благодарна если поможите.

Добавлено через 3 часа 30 минут
Здравствуйте! Помогите пожалуйста выполнить задания! Очень-очень прошу.

1. Создайте страничку, на которой по основному тексту "проплывает" Ваше имя. Алгоритм движения: текст двигается по заданной траектории; через некоторое время текст "скачком" возвращается в исходное положение и все повторяется.
Движение: Из нижнего правого угла в верхний левый, далее в просто вниз, далее в верхний правый угол.
2. Создайте страничку, на которой по основному тексту "проплывает" Ваше имя. Алгоритм движения: текст начинает двигаться по заданной траектории; через некоторое время текст меняет направление движения, доходит до исходного положения и все повторяется.
3. Создайте страничку, на которой по основному тексту "проплывает" ваше имя. Алгоритм движения: текст должен двигаться по косинусоиде сверху вниз и "скачком" возвращаться в исходное положение.
4. Создайте страничку, на которой по основному тексту "проплывает" Ваше имя. Алгоритм движения: текст должен двигаться по косинусоиде сверху вниз, затем менять направление движения; в исход¬ном положении все повторяется заново.
5. Создайте страничку, на которой по основному тексту "плавает" Ваше имя. Управление движением — при помощи экранных кнопок.
6. Создайте страничку, на которой по основному тексту "плавает" Ваше имя. Управление движением — при помощи кнопок клавиатуры.
7. Создайте страничку, на которой по основному тексту можно перетаскивать мышью Ваше имя.
0
супермизантроп
Эксперт JS
3941 / 2979 / 692
Регистрация: 18.04.2012
Сообщений: 8,629
22.12.2015, 05:33
Tatsianasuslik, вы бы хоть задания свои переписали верно, а потом уже помощь просили

перечитайте тот бред, который вы два раза написали под пунктами 2 -- по какой-такой "заданной траектории" должно двигаться ваше имя? кем эта траектория задаётся, как эта траектория задаётся? и где находится "исходное положение"?
0
Ренегат
Эксперт HTML/CSS
 Аватар для BANO
1740 / 1085 / 386
Регистрация: 06.08.2014
Сообщений: 5,203
Записей в блоге: 1
22.12.2015, 17:32
Tatsianasuslik, и ещё
почитайте правила форума, там чётко написано, что на 1 вопрос 1 тема
0
0 / 0 / 0
Регистрация: 12.02.2015
Сообщений: 7
22.12.2015, 19:25
во втором задании траектория движения такая же как и в первом задании.
снимок траектории я приложила.
Изображения
 
0
супермизантроп
Эксперт JS
3941 / 2979 / 692
Регистрация: 18.04.2012
Сообщений: 8,629
22.12.2015, 23:25
Tatsianasuslik, поясните -- сколько всего разных решений вы от нас ждёте? 9? 7? или 9 + 7 = 16?
0
0 / 0 / 0
Регистрация: 12.02.2015
Сообщений: 7
23.12.2015, 15:16
если есть возможность, помогите с первыми 6 задачами.
0
супермизантроп
Эксперт JS
3941 / 2979 / 692
Регистрация: 18.04.2012
Сообщений: 8,629
23.12.2015, 16:19
Задача 6. Управление кнопками клавиатуры
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=windows-1251">
<title>6. Управление стрелками клавиатуры</title>
<style>
html, body {height: 100%; overflow: hidden; margin: 0}
p {text-align: justify; margin: 45px}
#myName {position: absolute; z-index: 5; font-size: 46px; font-weight: bold; color: red; visibility: hidden}
</style>
<script>
onload = function ()
{
with (document.body)
   {
   var W = clientWidth, H = clientHeight;
   onkeydown = function (e) {var e = window.event || e, k = e.keyCode; if (k == 37) dL = -5;
                                                                  else if (k == 38) dU = -5; 
                                                                  else if (k == 39) dR =  5;
                                                                  else if (k == 40) dB =  5}
 
   onkeyup = function (e)   {var e = window.event || e, k = e.keyCode; if (k == 37) dL =  0;
                                                                  else if (k == 38) dU =  0; 
                                                                  else if (k == 39) dR =  0;
                                                                  else if (k == 40) dB =  0}
var O = document.getElementById ('myName'); with (O) var w = offsetWidth, h = offsetHeight;
var Lmin = Tmin = dL = dU = dR = dB = 0, Lmax = W - w,
   Oleft = Lmax / 2, Tmax = H - h, Otop = Tmax / 2, p = 'px';
   with (O.style) left = Oleft + p, top = Otop + p, visibility = 'visible';
 
      function MoveText ()
      {
      Oleft += dL + dR; if (Oleft < Lmin) Oleft = Lmin; if (Oleft > Lmax) Oleft = Lmax;
      Otop  += dU + dB; if (Otop  < Tmin) Otop  = Tmin; if (Otop  > Tmax) Otop  = Tmax;
      with (O.style) left = Oleft + p, top = Otop + p;
      TMR = setTimeout (MoveText, 20);
      }
   }  
MoveText ();
}
</script>
</head>
<body>
<div id="myName">Tatsianasuslik</div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<hr>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<hr>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<hr>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<hr>
</body>
</html>
полюбоваться
0
0 / 0 / 0
Регистрация: 12.02.2015
Сообщений: 7
23.12.2015, 17:54
спасибо за решение)))

Добавлено через 30 минут
помогите пожалуйста и с первыми пятью заданиями.
0
супермизантроп
Эксперт JS
3941 / 2979 / 692
Регистрация: 18.04.2012
Сообщений: 8,629
23.12.2015, 19:43
Задача 4. по косинусоиде сверху вниз, затем менять направление движения
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=windows-1251">
<title>4. по косинусоиде сверху вниз и обратно</title>
<style>
html, body {height: 100%; overflow: hidden}
p {margin: 45px}
#myName {position: absolute; z-index: 5; font-size: 64px; font-weight: bold; color: red}
</style>
<script>
onload = function ()
{
                                with (document.body) var W = clientWidth, H = clientHeight;
var O = document.getElementById ('myName'); with (O) var w = offsetWidth, h = offsetHeight;
var scaleL = offsetL = (W - w) / 2, scaleT = (H - h) / 8 / Math.PI, T = 0, dir = -1, p = 'px';
   function MoveText ()
   {
   with (O.style) top = T + p, left = (Math.cos (T * scaleT) * scaleL + offsetL) + p;
   if (!T || T == H - h) dir *= -1; T += dir; setTimeout (MoveText, 50);
   }
MoveText ();
}
</script>
</head>
<body>
<div id="myName">Tatsianasuslik</div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<hr>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<hr>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<hr>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<hr>
</body>
</html>
полюбоваться
0
Ренегат
Эксперт HTML/CSS
 Аватар для BANO
1740 / 1085 / 386
Регистрация: 06.08.2014
Сообщений: 5,203
Записей в блоге: 1
23.12.2015, 20:11
kalabuni, ааааааа
мои глаза...

пожалуйста поставьте
CSS
1
#myName {position: absolute; z-index: 5; font-size: 64px; font-weight: bold; color: red; transition: all .5s linear;}
и
JavaScript
1
setTimeout (MoveText, 500)
а то это очень уж слишком быстро
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
23.12.2015, 20:11
Помогаю со студенческими работами здесь

Текст двигающийся посимвольно
Как возможно реализовать текст на подобии такого: Он нужен в таймер передвигается текст в окошке Пример: Hello World! текст ...

Двигающийся круг.
Помогите пожалуйста! Надо нарисовать круг и сделать так чтобы он двигался по Form1 и отбивался от стенок. С кругом я вроде справился но с...

Двигающийся человек
Привет всем , скиньте пожалуйста код двигающегося человека

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

Реализовать двигающийся объект
Составить программу на языке Pascal для решения задачи с использованием типа данных «объект» Нужно вот этот код сделать с типом данных...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
20
Закрытая тема Создать тему
Новые блоги и статьи
сукцессия микоризы: основная теория в виде двух уравнений.
anaschu 11.01.2026
https:/ / rutube. ru/ video/ 7a537f578d808e67a3c6fd818a44a5c4/
WordPad для Windows 11
Jel 10.01.2026
WordPad для Windows 11 — это приложение, которое восстанавливает классический текстовый редактор WordPad в операционной системе Windows 11. После того как Microsoft исключила WordPad из. . .
Classic Notepad for Windows 11
Jel 10.01.2026
Old Classic Notepad for Windows 11 Приложение для Windows 11, позволяющее пользователям вернуть классическую версию текстового редактора «Блокнот» из Windows 10. Программа предоставляет более. . .
Почему дизайн решает?
Neotwalker 09.01.2026
В современном мире, где конкуренция за внимание потребителя достигла пика, дизайн становится мощным инструментом для успеха бренда. Это не просто красивый внешний вид продукта или сайта — это. . .
Модель микоризы: классовый агентный подход 3
anaschu 06.01.2026
aa0a7f55b50dd51c5ec569d2d10c54f6/ O1rJuneU_ls https:/ / vkvideo. ru/ video-115721503_456239114
Owen Logic: О недопустимости использования связки «аналоговый ПИД» + RegKZR
ФедосеевПавел 06.01.2026
Owen Logic: О недопустимости использования связки «аналоговый ПИД» + RegKZR ВВЕДЕНИЕ Введу сокращения: аналоговый ПИД — ПИД регулятор с управляющим выходом в виде числа в диапазоне от 0% до. . .
Модель микоризы: классовый агентный подход 2
anaschu 06.01.2026
репозиторий https:/ / github. com/ shumilovas/ fungi ветка по-частям. коммит Create переделка под биомассу. txt вход sc, но sm считается внутри мицелия. кстати, обьем тоже должен там считаться. . . .
Расчёт токов в цепи постоянного тока
igorrr37 05.01.2026
/ * Дана цепь постоянного тока с сопротивлениями и источниками (напряжения, ЭДС и тока). Найти токи и напряжения во всех элементах. Программа составляет систему уравнений по 1 и 2 законам Кирхгофа и. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru