Detaillierte Erläuterung der Beispiele für gleichmäßige JS-Bewegungen

Dieser Artikel zeigt Ihnen hauptsächlich detaillierte Beispiele für die gleichförmige JS-Bewegung. Ich hoffe, er kann Ihnen zunächst die Grundprinzipien der JS-Bewegung vorstellen.

Grundprinzipien der JS-Bewegung:

Um p zu bewegen, ist der Schlüssel, die Koordinaten des Objekts zu ändern,

op.style.left=offsetLeft+speed+'px';

Aber das kann nur einmal verschoben werden. Wir können den Timer verwenden, um diesen Vorgang zu „verschieben“.

setInterval(funtion(){
op.style.left=offsetLeft+speed+'px'; （speed是每次移动的像素）
},30)

Auf diese Weise können Sie trainieren, aber die Wirkung ist nicht das, was wir brauchen. Der Quellcode lautet wie folgt:

Um ein sich bewegendes Objekt zu stoppen: Der Schlüssel besteht darin, die Größe von offsetLeft zu bestimmen und den Timer auszuschalten; 🎜>
Verwandte Empfehlungen:

var timer=null;
time=setInterval(function(){
                     if(op.offsetLeft>=300){
clearInterval(timer);
                         }else{
op.style.left=op.offsetLeft+10+‘px’；}
},30)这样还是有小瑕疵，就是多次点击造成的BUG，解决方法就是关闭上次的定时器：多加个clearInterval(timer)

So erstellen Sie ein universelles Framework für gleichförmige Bewegungen

Ein Beispiel für gleichförmige Bewegungen basierend auf js

Detaillierte Einführung in Bewegungen mit gleichmäßiger Geschwindigkeit und Bewegungen mit variabler Geschwindigkeit (Puffer) in JavaScript_Grundkenntnisse

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung der Beispiele für gleichmäßige JS-Bewegungen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!