01.09.2012, 17:44
|
|
Интересующийся
|
|
Регистрация: 01.09.2012
Сообщений: 16
|
|
Сообщение от bes
|
Deff, там ссылки на элементы, неувязка в том, что всё происходит не синхронно, так как новый элемент, ссылка на который добавляется в конец массива происходит раньше и ссылки на элементы, которые ещё не дошли до низа просто теряются, так как заменяются новыми
Mkaa, объясняйте подробнее конечный эффект, который должен получиться
|
Починить то что есть. Разобравшись с работой ссылок на объекты. |
|
01.09.2012, 18:09
|
|
без статуса
|
|
Регистрация: 25.05.2012
Сообщений: 8,219
|
|
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache, must-revalidate">
<meta http-equiv="expires" content="0">
<meta http-equiv="last-modified" content="">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript" src="http://l2gj.gev1.ru/jquery-1.8.0.min.js"></script>
<script type="text/javascript">
var _units=new Array();
var _xunits=new Array();
var _xhostile=new Array(0,40,80,120,160);
var count=0;
var stick;
var new_input;
var new_unit;
document.ready=function(){
stick = document.createElement("INPUT");
stick.setAttribute("value",count);
var new_put=document.getElementById('stick');
new_put.appendChild(stick);
}
function UnitMov(){
for(var i=0;i<=count;i++)
{ stick.value=i;
_xunits[i]=_xunits[i]+2;
_units[i].style.top=_xunits[i]+'px';
if(_xunits[i]>400){
count=count-1;
new_input.removeChild(_units[i]);
//alert("A")
_units[i]=_units[count];
//alert("И")
_xunits[i]=_xunits[count];
//alert("B")
}
}
}
function UnitCr(){
var round = Math.round(Math.random() * 4);
new_unit=document.createElement('div');
new_unit.innerHTML='<img src="http://l2gj.gev1.ru/img/sq.png" />';
new_unit.setAttribute("style","left:"+_xhostile[round]+"px;top:0px;position:absolute;");
new_unit.setAttribute("id",count);
_units[count]=new_unit;
_xunits[count]=0;
new_input=document.getElementById('hostile');
new_input.appendChild(_units[count]);
count=count+1;
}
var _unitmovetimer=setInterval(UnitMov, 10);
var _unitcrtimer=setInterval(UnitCr, 1000);
</script>
<style type="text/css">
body{background-color:#000000;}
.ground{border:1px solid #ffffff;margin: 1px auto;width:200px;height:400px;position:relative;}
#as{position: absolute; top: 320px; left: 160px; box-shadow: 1px 1px 5px #000000; }
#hostile{width:200px;height:400px;position:relative;}
#unit{background:url(http://l2gj.gev1.ru/img/sq.png);width:40px;height:40px;position:absolute;left:0px;right:0px;display:inline;}
#stick{border:1px solid #ffffff;margin: 1px auto;width:100px;height:50px;position:absolute;background-color:#ffffff;color:#000000;left:200px;top:0px;}
</style>
<body>
<div class="ground">
<div id="stick"></div>
<div id="hostile"></div>
</div>
</body></html>
|
|
01.09.2012, 18:34
|
|
Интересующийся
|
|
Регистрация: 01.09.2012
Сообщений: 16
|
|
|
Ппц... Почему так? Смешно же получается, что счетчик уменьшается до присвоения последнего элемента... Всегда так делал(правда в другой сфере).
Спасибо за решение.
Но блин реально не понятно.
|
|
01.09.2012, 18:45
|
|
без статуса
|
|
Регистрация: 25.05.2012
Сообщений: 8,219
|
|
|
Mkaa,
Обисняю - мы уменьшаем счетчик фактически удалив элемент из скрипта - а затем и из DOM - поскольку следущий скрипт асинхронно может перехватить счетчик с еще неудаленным элементом из счетчика - а которого уже реально в DOM нет - вот и вся феня с зависом
|
|
01.09.2012, 18:47
|
|
Интересующийся
|
|
Регистрация: 01.09.2012
Сообщений: 16
|
|
|
Сообщение от Deff
|
Mkaa,
Обисняю - мы уменьшаем счетчик фактически удалив элемент из скрипта - а затем и из DOM - поскольку следущий скрипт асинхронно может перехватить счетчик с еще неудаленным элементом из счетчика - а которого уже реально в DOM нет - вот и вся феня с зависом
|
А это считается нормальным, когда я делаю активным другое окно, javascript начинает лагать? И создавать все больше и больше элементов не двигая их? Это можно как-то обойти? |
|
01.09.2012, 19:02
|
 |
Профессор
|
|
Регистрация: 22.03.2012
Сообщений: 3,744
|
|
|
Сообщение от Mkaa
|
|
Починить то что есть. Разобравшись с работой ссылок на объекты.
|
очень понятное описание .... для экстрасенсов
<style>
.div {
position: absolute;
width: 20px;
height: 20px;
border: solid 3px navy;
}
</style>
<script>
window.onload = function () {
function move () {
var elem = document.createElement('div');
elem.className = 'div';
elem.style.top = '0px';
elem.style.left = 500 * Math.random() + 'px';
document.body.appendChild(elem);
var int = setInterval(function () {
var top = parseInt(elem.style.top);
if (top > 300) {
clearInterval(int);
document.body.removeChild(elem);
} else {
elem.style.top = top + 1 + 'px';
}
}, 10)
}
setInterval(function () {move()}, 1000);
}
</script>
|
|
01.09.2012, 19:24
|
|
Интересующийся
|
|
Регистрация: 01.09.2012
Сообщений: 16
|
|
|
А что еще писать та? Есть мой код, хочу чтобы он работал без багов. Что должно быть я тоже написал... Тут по-моему не только экстрасенсов не хватает, но кое-чего еще. За альтернативу спасибо. Но что плохого в моем коде, кроме того что он малость работает не корректно? Может я просто чего то не догоняю, может я не врубаюсь в принцип работы JS? Помему ответ на этот вопрос давно бы закрыл эту тему.
|
|
01.09.2012, 19:34
|
|
Профессор
|
|
Регистрация: 22.03.2012
Сообщений: 3,744
|
|
ну читабельность кода страдает + код как надо не работает + возможны альтернативные пути решения
вывод: необходимы очень сильное желание разобраться в коде + экстрасенсорные способности, чтобы догадаться какого же результата хочет добиться ТС
так поинтересней будет
<style>
.div {
position: absolute;
width: 20px;
height: 20px;
}
img {
border-radius: 3 3 8 8;
width: 100%;
height: 100%;
}
</style>
<script>
window.onload = function () {
function move () {
var elem = document.createElement('div');
elem.className = 'div';
elem.style.top = '0px';
elem.style.left = 500 * Math.random() + 'px';
elem.innerHTML = '<img src="http://javascript.ru/forum/image.php?u=19820&dateline=1334914235">';
document.body.appendChild(elem);
var int = setInterval(function () {
var top = parseInt(elem.style.top);
if (top > 300) {
clearInterval(int);
document.body.removeChild(elem);
} else {
elem.style.top = top + 1 + 'px';
}
}, 30)
}
setInterval(function () {move()}, 800);
}
</script>
|
|
01.09.2012, 19:38
|
|
без статуса
|
|
Регистрация: 25.05.2012
Сообщений: 8,219
|
|
|
Сообщение от Mkaa
|
|
А это считается нормальным, когда я делаю активным другое окно, javascript начинает лагать? И создавать все больше и больше элементов не двигая их?
|
 Забавно - не я придумывал двигатель... |
|
01.09.2012, 20:20
|
|
Интересующийся
|
|
Регистрация: 01.09.2012
Сообщений: 16
|
|
|
Во=) Правда, Так как у каждого объекта своя функция то они удалаяются, мои же нет=)
|
|
|
|
