анимация фона
есть код, я доволен, все работает даже в ие, но мне всёравно кажется, что код кривой, код заставляет ехать фон влево, у меня есть его реализация с jQwery и mootools, но она тормозит и много весит, это намного проще, но хотел бы узнать, что тут лишнего, и что лучше добавить:
<div onclick="animate('ex1', function(p) {return p;})" id="ex1">
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa<br />
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa<br />
</div>
function animate(id, delta, dur) {
element = document.getElementById(id);
from = 0;
to = 1;
duration = dur || 100;
start = new Date().getTime();
setTimeout(function() {
var now = (new Date().getTime()) - start;
var progress = now / duration;
var result = (to - from)*delta(progress)+from;
element.style.backgroundPosition = "-"+result+"mm 0mm";
//element.innerHTML = result;
if (true)
setTimeout(arguments.callee, 1);
}, 10);
}
|
function animate(id, delta) {
element = document.getElementById(id);
from = 0;
to = 1;
duration = 100;
start = new Date().getTime();
setTimeout(function() {
var now = (new Date().getTime()) - start;
var progress = now / duration;
var result = (to - from)*delta(progress)+from;
element.style.backgroundPosition = "-"+result+"mm 0mm";
//element.innerHTML = result;
setTimeout(arguments.callee, 1);
}, 10);
}
убрал лишнее |
Не то, что бы лишнее, просто не понимаю, зачем так сложно:
(new Date().getTime()) - start;??? Я бы написал так: new Date - start;А вот что element, from, to и т.д. - глобальные переменные, - плохо! Будет конфликт, если запустить несколько функций. |
Sweet,
function animate(id) {
element = document.getElementById(id);
from = 0;
to = -1;
duration = 100;
start = new Date().getTime();
setTimeout(function() {
now = new Date() - start;
progress = now / duration;
result = (to - from)*progress+from;
element.style.backgroundPosition = result+"mm 0mm";
//element.innerHTML = result;
setTimeout(arguments.callee, 1);
}, 10);
}
пока это получилось, я думаю переменные убрать, прописать в формеле все, что можно |
Sweet,
function animate(id) {
element = document.getElementById(id);
duration = 100;
start = new Date().getTime();
setTimeout(function() {
now = new Date() - start;
progress = now / duration;
result = -1*progress;
element.style.backgroundPosition = result+"mm 0mm";
//element.innerHTML = result;
setTimeout(arguments.callee, 1);
}, 10);
}
получилось так |
function animate(id) {
element = document.getElementById(id);
duration = 100;
start = new Date()
setTimeout(function() {
now = new Date() - start;
progress = now / duration;
result = -1*progress;
element.style.backgroundPosition = result+"mm 0mm";
//element.innerHTML = result;
setTimeout(arguments.callee, 1);
}, 10);
}
|
function animate(id) {
element=document.getElementById(id);
start=new Date()
setTimeout(function() {
now=new Date() - start;
progress=now / 100;
result=-1*progress;
element.style.backgroundPosition=result+"mm 0mm";
setTimeout(arguments.callee,1);
},10);
}
|
qwertyuiop,
качественно флудишь! Ты не видишь кнопочку "Ред." в правом нижнем углу сообщений? Рекомендую пользоваться ей. И используй var! |
Sweet,
ок, ток зачем вар? может глупый вопрос, но всё же, я никогда не использую |
Sweet,
понял, чтобы за пределы функции не лезли |
| Часовой пояс GMT +3, время: 21:41. |