Вход

Просмотр полной версии : случайно (из заданого) менять текст и его цвет по событию Mousemove


hankmoody
11.11.2010, 20:36
Идея в том, чтобы были заданные тексты и цвета. они random'но выводятся в div или span и меняются по событию mouseMove на body. По мере амплитуды/скорости или резкости движений мышью меняется этот текст. т.е. чем быстрее провожу мышью в <body></body>, тем быстрее в случайном порядке меняется текст и его цвет.

Перерыл интернеты - ничего даже похожего не нашел.
Интересно увидеть любую информацию по теме. Т.к. сам только начинаю изучение javascript.

для случаный фраз использую код:
var ar = new Array();
ar[0] = "1";
ar[1] = "2";
ar[2] = "3";
ar[3] = "а";
ar[4] = "б";
ar[5] = "в";
ar[6] = "г";
ar[7] = "д";
ar[8] = "a";
ar[9] = "b";
ar[10] = "c";
document.write(ar[Math.round(Math.random()*10)]);

monolithed
11.11.2010, 22:13
Примерно так:

<div id="div"></div>

<script type="text/javascript">
window.onload = function(){
var array = ['a', 'b', 'c', 'd', 'e', 6, 7, 8, 9, 10];
document.onmousemove = function(){
return function(){
document.getElementById('div').innerHTML = array[Math.floor(Math.random() * array.length)];
};
}();
};
</script>

рони
11.11.2010, 22:56
monolithed,
маленький на всякий случай )))
Math.round(Math.random()*10)
выдаст от 0 до 10 включительно всего элементов 10 значит array[10]=undefined
Math.floor(Math.random() * array.length)
да и замыкание здесь излишне
<div id="div"></div>
<script type="text/javascript">
window.onload = function () {
document.onmousemove = function () {
var a = ["a", "b", "c", "d", "e", 6, 7, 8, 9, 10];
document.getElementById("div").innerHTML = a[Math.floor(Math.random() * a.length)]
}
};
</script>

monolithed
11.11.2010, 23:14
выдаст от 0 до 10 включительно всего элементов 10 значит array[10]=undefined

Не доглядел
да и замыкание здесь излишне
Хотел итерацию с задержкой сделать, потом передумал и забыл об этом))

hankmoody
11.11.2010, 23:31
Спасибо. а можно ли как-то регулировать скорость изменения текста по мере движения мыши?

monolithed
12.11.2010, 08:42
Думаю можно, но это будет через одно место

рони
12.11.2010, 12:24
Вариант ... "через одно место" )
<div id="div"></div>
<script type="text/javascript">
i = 200;
f = 1;
window.onload = function () {
document.onmousemove = function () {
var a = ["Никто так не торопит других, как лентяи",
"Лень ничего не создает и созданное уничтожает",
"Желание сделать слишком много служит для многих предлогом не делать ничего",
"Лень делает всякое дело трудным",
"Бездельнику и ленивому и помощь не поможет"];
i && i--;
if (f&&i<200) {
f = 0;
s = a[Math.floor(Math.random() * a.length)];
document.getElementById("div").innerHTML = "";
setTimeout(function () { i++;
document.getElementById("div").innerHTML += s.charAt(0);
if (s = s.substr(1)) setTimeout(arguments.callee, i);
else {
f = 1;
i = 205
}
}, 10)
}
}
};
</script>

hankmoody
12.11.2010, 14:23
буду думать как лучше))

спасибо всем!