如何自動將圖像對齊爲html或javascript

下面是我的代碼，它有三個圖像水平對齊排列。點擊每個圖像後，我添加了一些簡單的操作來刪除其他圖像，但圖像2和圖像3（如果點擊）仍然會保留在其當前區域，而不是左對齊像圖像1.有沒有一種方法可以左對齊圖像2或3，如果他們點擊？非常感謝如何自動將圖像對齊爲html或javascript

<div style="width:510px; height:105px; padding:5px;"> 

    <img alt="Passenger Vehicle" id="V1" src="http://hou-agsprd02/images/basictruck.gif" onclick="Vehicle1()" style="width:150px; height:100px; border:1px solid blue; float:left;" /> 
    <img alt="Water Vehicle" id="V2" src="http://hou-agsprd02/images/WaterTruck.gif" onclick="Vehicle2()" style="width:150px; height:100px; border:1px solid blue; float:left;" /> 
    <img alt="Rig Transport Vehicle" id="V3" src="http://hou-agsprd02/images/GasTruck.gif" onclick="Vehicle3()" style="width:150px; height:100px; border:1px solid blue; float:left;" /> 

</div>

這是我在隱藏其他功能代碼的圖像2和3，如果圖像1被點擊，遺憾離開了這一點。

document.getElementById('V2').style.visibility = 'hidden'; 
document.getElementById('V3').style.visibility = 'hidden';

來源

2013-02-07 DaBears

你如何去除它們？你的JavaScript代碼是什麼？ – Axel

@Axel：對不起，離開了。我現在只是將它添加到我的代碼/問題的底部。 – DaBears

您將隱藏的可見性設置爲隱藏，這實質上隱藏了塊，但仍然佔用了佈局中的空間。

您想要做的是通過將display屬性設置爲none來刪除塊曾經是的空間。

基於JavaScript代碼，你可以通過改變你的代碼，這樣做：

document.getElementById('V2').style.display = 'none'; 
document.getElementById('V3').style.display = 'none';

這樣做了以後，你會發現，該塊將被刪除，而它周圍的元素會崩潰進入隱藏塊曾經的地區。

來源

2013-02-07 17:48:22 Axel

完美..謝謝Axel .. – DaBears

什麼是你的Javascript代碼？如果你只是隱藏圖像，它仍然存在。您將需要實際從頁面中刪除圖像，然後圖像將填充它的位置，因爲它們是向左浮動的。

來源

2013-02-07 17:18:02 Landon

對不起，我剛剛添加了我用來隱藏圖像的代碼 – DaBears

如何自動將圖像對齊爲html或javascript

回答

相關問題