単純な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'); 
}