style.top和style.left不工作

我有一個腳本寫道，當按下按鈕時，formatdialog div被調整大小。問題是，我無法弄清楚爲什麼我的JavaScript代碼不起作用。我可以調整寬度和高度，但無論出於何種原因，頂部和左側都無法調整。style.top和style.left不工作

這對我來說沒有任何意義，可能會導致問題。 Firebug不會給我任何錯誤。 JavaScript只是調整寬度和高度，忽略頂部和左側屬性。我猜測，CSS屬性造成了一個問題，我只是不知道是什麼。

CSS：

#formatdialog { 
      display:none; 
      left:25%; 
      top:25%; 
      width:400px; 
      height:200px; 
      position:absolute; 
      z-index:100; 
      background:white; 
      padding:2px; 
      font:10pt tahoma; 
      border:1px solid gray 
     }

的Javascript：

function FormatDialogResize(){ 
     var elem = document.getElementById('FormatDialog'); 
     elem.style.top = "10%"; 
     elem.style.left = "10%";    
     elem.style.width = "600px"; 
     elem.style.height = "500px"; 
    }

我也試過：

function FormatDialogResize(){ 
     var elem = document.getElementById('FormatDialog'); 
     elem.style.top = 10+"%"; 
     elem.style.left = 10+"%";   
     elem.style.width = "600px"; 
     elem.style.height = "500px"; 
    }

感謝。

來源

2012-09-21 pr-

你試過用px來定位它是否會移動嗎？也許百分比計算是關閉的。 – n8wrl

@ n8wrl我也嘗試過使用px。我嘗試使用「10px」和10+「px」。兩人都沒有改變屬性。我正在FF和Chrome中進行測試。我不確定這會如何影響任何事情。我會在IE上測試，但我現在的窗口框是OOC。 –

爲什麼你的類名失蹤元素ID帕斯卡外殼中的classid

#formatdialog { 

FormatDialog

你有一個錯字。

元素ID是formatdialog但你試圖調用FormatDialog

var elem = document.getElementById('FormatDialog');

您的代碼應該是這樣的：

<div id="formatdialog"> 

</div> 

var elem = document.getElementById('formatdialog'); 
elem.style.top = "10%"; 
elem.style.left = "10%"; 
elem.style.width = "600px"; 
elem.style.height = "500px"; 

#formatdialog 
{ 
    left:25%; 
    top:25%; 
    width:400px; 
    height:200px; 
    position:absolute; 
    z-index:100; 
    padding:2px; 
    font:10pt tahoma; 
    border:1px solid gray; 
    background-color:orange; 
}

如果你想使用Pascal大小寫確保元素ID和類別相同

檢查此Fiddle

來源

2012-09-21 17:41:16

我對CSS有點新鮮。無論什麼原因，當我嘗試輸入正確的帕斯卡套管時，它有時無法正常工作。無論出於何種原因，所有小寫字體均可正常工作我只是試圖將我的代碼返回到正確的Pascal外殼。樣式仍然設置相同。頂部和左側的樣式仍然不起作用。 –

檢查上面更新的代碼 –

不幸的是，jQuery的路線不起作用。我試過改變外殼，但這也沒有什麼不同。我的直覺告訴我，這是一個JS錯誤。看起來我不得不慢慢地找出問題，看看是什麼造成的。 –

style.top和style.left不工作

回答

相關問題