1

将来これを読みたい人のためにこのページを編集する:P

私はここであまりにも多くを求めているようです..しかし、この問題で私を助けてくれた人たちに感謝します!実際、私はあなたの答えをすべて受け入れたいのですが、私は1つしか受け入れられないようです..>。>

質問1:画像を移動したいのですが、(を使用して)
画像の位置を取得しようとすると、整数に変換するとNaN値が表示されます。これをどうやって直すのかしら:/document.getElementById().style.left

これが私のコードです:

<script type="text/javascript">

    function playit()
    {
        alert(parseInt(document.getElementById('ball').style.left)); <!-- shows a NaN value -->
    }
</script>

画像をテーブルに配置し、onclick関数を使用して呼び出します。<td id="frame" colspan="5" onclick="playit()">正確には、私は次のように画像を宣言しました:<img src="play/ball.png" id="ball" name="ball"/>

写真のCSSは次のとおりです。

#ball
{
    position:absolute;
    top:500px;
    left:500px; 
}

解決策( VIPIN JAINによって提供):.offsetLeft代わりに使用element.style.left




質問2:
編集: で修正しましたが.offsetLeft、問題なく動作します。画像を移動しようとすると、別のエラーが発生しました。再帰を使いすぎているそうです。再帰を使用しているために発生することはわかっていますが、再帰を使用することの何が問題になっているのでしょうか。

これが私のコードです:

<script type="text/javascript">

    <script type="text/javascript">

    var lball = document.getElementById('ball').offsetLeft;
    var speed = 500;

    function moveleft()
    {
        if(document.getElementById('ball').offsetLeft >0)
        {
            document.getElementById('ball').offsetLeft-=1;

            setTimeout(moveleft(), speed);
        }
        else gameover();
    }
    function playit()
    {
        score = 0;
        setTimeout(moveleft(), speed);
    }
</script>

誰かがこれを手伝ってくれますか?ありがとう:) 解決策( Teemu

によって与えられた): 「 編集II」の部分に関する以下のTeemuのコメントを参照してください。


質問3(実際にはコメントで質問しています:P)
を使用して画像の位置を設定しようとするとdocument.getElementById('ball').offsetLeft-=1;未定義の値が表示されます。

解決策(Kemal Fadillahによる):「これは、要素の値を設定できないためですoffsetLeft。新しい位置の値をに設定する必要があります。次の.style.leftようになります:element.style.left = new_value + "px";


質問4(ここでもコメントで質問しています:P) 画像がスムーズに移動しない
ようです(突然別の場所に「ワープ」しているように見えます)。値を上げましたが、まだ機能していません。私はそれで何かが欠けていますか?疑問 思います。_ 3.」speed

speed

4

4 に答える 4

1

jQueryを使用する必要があります。はるかに簡単です。次のようなものを試してください

$(function(){
$("img#ball").offset({top: 10px, left: 500px});
});

詳細については、こちらをご覧ください。

http://api.jquery.com/offset/

一般的なjQueryに関する情報は、次の場所にあります。

http://jquery.com/

于 2012-04-16T11:17:00.230 に答える
1

これには必要な値がoffsetLeftありoffsetTop、リンクを参照してください

この郵便受け

于 2012-04-16T11:17:09.667 に答える
1

element.style外部スタイルシート内で宣言されている場合、使用して CSS スタイルを取得することはできません。MDN ドキュメントから:

ただし、要素のインライン スタイル属性で設定された CSS 宣言のみを表し、セクション内のスタイル ルールや外部スタイルなど、他の場所のスタイル ルールに由来するものではないため、要素のスタイル全般について学習するのには役立ちません。シート。

https://developer.mozilla.org/en/DOM/element.style

代わりに、 を使用window.getComputedStyle()してプロパティを取得する必要があります。

window.getComputedStyle(document.getElementById('ball')).left; // returns 500px
于 2012-04-16T11:42:38.090 に答える
1

document.getElementById('ball').style.leftプロパティを取得する前に設定していない場合は、''(または) を返します。からundefined取得するのはそのためです。NaNparseInt()

編集:

スタイルの定義は問題ないようです (投稿を編集した後)。で基数を使用することができますparseInt():

alert(parseInt(document.getElementById('ball').style.left,10));

これは斜めではないと文書化されていますが、使用すると役立つ場合があります。

編集Ⅱ

これは、すべてsetTimeoutの s を 2 回実行していて、それらをクリアしていないために発生します。このようにしてみてください:

var delay;

function moveLeft(){
  :
  if(delay){ // Add this if before all of your setTimeout() calls and in gameover() too
    clearTimeout(delay);
  }
  delay=setTimeout(moveLeft, speed);
  :
}

このようにタイムアウトを設定すると、 が原因ですぐにsetTimeout(doFunction(),delaytime);実行され、 が実行された後も、再帰が多すぎます...doFunction()delaytime

于 2012-04-16T11:34:12.533 に答える