Я сделал скрипт по образцу - скрипт движения змейкой. Вот его окончательный вариант:
| Код |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<body onload="move()" style="width:100%;overflow-x:hidden;overflow-y:hidden;">
</body>
<script>
var MarginUp=0
var MarginDown,MarginRight
var MarginLeft=0
//alert(MarginDown)
function StarObject(id,xpos,ypos){
this.id=id
this.xpos=xpos
this.ypos=ypos
}
stars=new Array()
var stepx=20
var stepy=20
var CasheImage=new Image()
CasheImage.src="testimage86.gif"
var rand
var picture
var temp,temp2
for (var i=0;i<12;i++){
stars[i]=new StarObject("img"+i,0,0)
picture='<img src="'+CasheImage.src+'" id="'+stars[i].id+'"'
picture+='style="position:absolute;left:'+stars[i].xpos+';top:'+stars[i].ypos+';">'
document.write(picture)
}
function randommaker(range) {
rand=Math.floor(range*Math.random())
return rand
}
//alert(ImgId[2])
function move(){
MarginDown=document.body.clientHeight-5
MarginRight=document.body.clientWidth-5
if (document.getElementById("img0").style.posLeft>MarginRight) {
stepx=(stepx+randommaker(2))*-1
document.getElementById(stars[0].id).style.posLeft-=1
}
if (document.getElementById("img0").style.posLeft<MarginLeft){
stepx=(stepx+randommaker(2))*-1
document.getElementById(stars[0].id).style.posLeft+=1
}
if (document.getElementById("img0").style.posTop<MarginUp){
stepy=(stepy+randommaker(2))*-1
document.getElementById(stars[0].id).style.posTop+=1
}
if (document.getElementById("img0").style.posTop>MarginDown){
stepy=(stepy+randommaker(2))*-1
document.getElementById(stars[0].id).style.posTop-=1
}
for (i=11;i>=1;i--){
stars[i].xpos=stars[i-1].xpos
stars[i].ypos=stars[i-1].ypos
}
stars[0].xpos=document.getElementById(stars[0].id).style.posLeft+stepx
stars[0].ypos=document.getElementById(stars[0].id).style.posTop+stepy
for (i=0;i<12;i++){
document.getElementById(stars[i].id).style.left=stars[i].xpos
document.getElementById(stars[i].id).style.top=stars[i].ypos
}
setTimeout("move()",40)
//alert("!!")
}
</script>
|
Этот вариант я сделал сличив написанный мной вариант со скачанным в инете. В моём варианте в функции move() проверка позиции делалась с использованием атрибутов left и top. В итоге скрипт оказывался глючным, змейка в какой-то момент, вместо того, чтобы оттолкнуться от стенки, начинала ползти вдоль неё и в конце концов исчезала за пределами экрана.
Так всё-таки, чем отличается posLeft от left, или posTop от top?
И ещё такой вопрос: для чего служит строчка кода " document.getElementById(stars[0].id).style.posLeft+=1"?
Для чего нужно прибавлять или убавлять единицу? Разобрался со всем кодом кроме этой строчки. |