如何創建一個簡單的Mootools彈出窗口

Question

我想創建一個簡單的Mootools彈出窗口，如下所示。

<?php for($i=1;$i<10;$i++) : ?> 

<a id="link_<?php echo $i;?>" onclick="viewContent(<?php echo $i;?>)">Click <?php echo $i;?></a> 
<br/> 
    <div class="modalDialog" id="content_<?php echo $i;?>" style="position:absolute;z-index: 100000; display: none; width: 300px; height: 150px; left: 430px; top: 143px;"> 
     <h1>Message<?php echo $i;?></h1> 
    </div> 

<?php endfor; ?> 

<script language="javascript"> 
function viewContent(id) 
{ 
    $('content_'+id).style.display = ''; 
} 
</script> 

雖然點擊一個鏈接，它會隱藏除此之外的所有其他內容區域，同時可見內容應該顯示爲一個彈出窗口。在上面的腳本中我們需要什麼改變。

Answer 1

所以你想要隱藏除點擊之外的所有東西？使用$$選擇器：

function viewContent(id) { 
    $$('.modalDialog').each(function(el){ 
     el.setStyle('display', 'none'); 
    }); 
    $('content_'+id).setStyle('display', 'block'); 
}