27.01.2012, 13:08
|
|
Интересующийся
|
|
Регистрация: 05.12.2011
Сообщений: 17
|
|
|
Да я понимаю, что это очень тяжело для браузера. Времени очень не хватает сейчас заняться этой задачкой.
|
|
27.01.2012, 23:01
|
|
Аспирант
|
|
Регистрация: 28.04.2011
Сообщений: 73
|
|
|
У меня глупый вопрос, а зачем плодить кучу элементов <span>.
Может стоит тягать по букве с помощью функции slice(startPos,endPos), а для анимации использовать один элемент (ну если строго по букве перемещать) в который перемещаемая буква будет закидываться??
Ну или для унификации функции сделать обертывание буквы элементом "на лету" ...
|
|
27.01.2012, 23:05
|
 |
Модератор
|
|
Регистрация: 27.04.2010
Сообщений: 3,417
|
|
|
Можно и так.
|
|
27.01.2012, 23:43
|
|
Аспирант
|
|
Регистрация: 28.04.2011
Сообщений: 73
|
|
Aж понравилось )
<html>
<head>
</head>
<body>
<div id="t" style="position: absolute">простидижетатор</div>
<script>
var obj = document.getElementById("t");
var x = 0;
var span = {};
var animation_on = false;
function move() {
x=x+1;
s=x+"px";
span.style.left=s;
}
var letters_move = function() {
// console.log(' x = '+x);
var o = obj.innerHTML;
if(animation_on)
{
if(x<100) {
move();
}else{
span.style.display='none';
animation_on = false;
x=0;
if(o.length<1) { return false; }
}
}else{
span = document.createElement('SPAN');
span.appendChild(document.createTextNode(o.slice(0,1)));
span.style.top = obj.offsetTop;
span.style.left = obj.offsetLeft;
span.style.position = "absolute";
document.getElementsByTagName('body')[0].appendChild(span);
obj.innerHTML = o.slice(1,o.length-1);
animation_on = true;
// console.log(' - animation_on: '+animation_on );
move();
}
setTimeout("letters_move()",7);
}
setTimeout("letters_move()",7);
</script>
</body>
</html>
Последний раз редактировалось trikadin, 28.01.2012 в 16:08.
|
|
27.01.2012, 23:57
|
|
Модератор
|
|
Регистрация: 27.04.2010
Сообщений: 3,417
|
|
|
Keeper, сделайте запускаемым, штоле...
|
|
28.01.2012, 00:15
|
|
Аспирант
|
|
Регистрация: 28.04.2011
Сообщений: 73
|
|
|
проверил в FF и Chrome, IE 9, Safari, Opera 11.60
Последний раз редактировалось Keeper, 28.01.2012 в 00:17.
|
|
28.01.2012, 10:46
|
|
Модератор
|
|
Регистрация: 27.04.2010
Сообщений: 3,417
|
|
|
Сообщение от Keeper
|
|
проверил в FF и Chrome, IE 9, Safari, Opera 11.60
|
Ты не понял) Вот здесь можно почитать о вставке запускаемого кода в свои сообщения.
Последний раз редактировалось trikadin, 28.01.2012 в 16:07.
Причина: Поправил ссылку.
|
|
28.01.2012, 14:26
|
|
Интересующийся
|
|
Регистрация: 05.12.2011
Сообщений: 17
|
|
Сообщение от trikadin
|
|
Ты не понял) Вот здесь можно почитать о вставке запускаемого кода в свои сообщения.
|
Ссылка на страничку получилась с тчк в конце)
Вот сюда, там описание как сделать код выкладываемый в сообщениях запускаемым. Т.е. появляется кнопа типа play. |
|
28.01.2012, 14:43
|
|
Интересующийся
|
|
Регистрация: 05.12.2011
Сообщений: 17
|
|
|
Сообщение от Keeper
|
|
Aж понравилось )
|
|
Сообщение от trikadin
|
|
Keeper, сделайте запускаемым, штоле...
|
Я немного причесал.
<html>
<head>
</head>
<body>
<div id="t" style="position: absolute">простидижетатор</div>
<script>
var obj = document.getElementById("t");
var x = 0;
var span = {};
var animation_on = false;
function move()
{
x=x+1;
s=x+"px";
span.style.left=s;
}
var letters_move = function()
{
// console.log(' x = '+x);
var o = obj.innerHTML;
if(animation_on)
{
if(x<100) { move();}
else
{
span.style.display='none';
animation_on = false;
x=0;
if(o.length<1) { return false;}
}
}
else
{
span = document.createElement('SPAN');
span.appendChild(document.createTextNode(o.slice(0,1)));
span.style.top = obj.offsetTop;
span.style.left = obj.offsetLeft;
span.style.position = "absolute";
document.getElementsByTagName('body')[0].appendChild(span);
obj.innerHTML = o.slice(1,o.length-1);
animation_on = true;
// console.log(' - animation_on: '+animation_on );
move();
}
setTimeout("letters_move()",7);
}
setTimeout("letters_move()",7);
</script>
</body>
</html>
|
|
28.01.2012, 15:09
|
|
Аспирант
|
|
Регистрация: 28.04.2011
Сообщений: 73
|
|
|
Дак помог нет ? )
|
|
|
|
