0

object.style.left&のobject.style.top値を読み取れないのはなぜですか?

ボタンを動的に移動しようとしています。

これを行うことで、javascript を使用してstyle.left&style.top値をリセットできます。

document.getElementById(theButton_ID).style.left = "128px";
document.getElementById(theButton_ID).style.top  =  "64px";

しかし、私の問題は、Web ページの読み込み時に動的に決定する必要がある倍率を使用して、「style.left」と「style.top」の値を動的にリセットする必要があることです。

私の初心者の考え方では、これは次のことを行う必要があることを意味します。

• style.left&style.top値を取得する

•それらにスケーリング係数を掛けます

style.left• これらの変更された値を&値に割り当てstyle.topます。

問題は、最初の場所でstyle.left&値を取得できないため、それらを変更したり、書き戻したりすることはできません。style.top

明らかに、私は何か間違ったことをしていて、理解すべきことを理解していません。

それで、私は何を間違っていますか？

私が見逃しているのは何ですか？

そして最も重要なのは、style.left&の値を取得して、style.topそれらを使用してボタンの位置を動的に変更するにはどうすればよいですか?

皆様のご協力とご提案に感謝いたします。

これが実際の HTML / CSS / Javascript コードです …</p> 

<html>
      <head>

         <title>Button Dynamic Move Test</title>

      <style type="text/css">

        #MoveButton
        {
            position    : absolute;
            left        :  8px;
            top     : 16px;
        }

     </style>

     <script>

//      var X_Index_Move_Factor = 1.25;
//      var Y_Index_Move_Factor = 1.50;

function Move_A_Button (theButton_ID)
{
alert (   "We're in 'Move_A_Button'"
        + "\n"
        + " The Button Id = "
        +   theButton_ID
        );              

var the_Old_Button_X_Offset = document.getElementById(theButtonId).style.left;

var the_Old_Button_Y_Offset = document.getElementById(theButtonId).style.top;

    alert (   "the_Old_Button_X_Offset = "
        + "\n"
        +   the_Old_Button_X_Offset   
        + "the_Old_Button_Y_Offset = "
        + "\n"
        +   the_Old_Button_Y_Offset
        );              
}

</script>
</head>

<body>

     <button type = "button"
       id       = "MoveButton" 
      onclick   = "Move_A_Button ('MoveButton')">
     About Us
    </button>

</body>
</html>
4

3 に答える 3

1

タイプミスが修正されても、要素自体には何も設定されていないため、要素には最初はスタイルがありtopません。left

element.offsetLeft出発点としてelement.offsetTop最善の策です。

于 2013-05-08T02:52:45.623 に答える