イメージのみを表示する方法は、残りの部分は最初に表示して表示しますか？

Question

aboutとsizeをクリックして残りの部分を隠して表示することができましたが、ウェブページが開いたときに最初に画像を表示します。私のコードでは、画像をクリックするだけで画像が開きます。ここに私のコードは次のとおりです。

<div class="col- menu"> 
     <ul> 
      <li><a href="#" onclick="toggleStuff('pic1'); return false;">Picture</a></li> 
      <li><a href="#" onclick="toggleStuff('description'); return false;">About</a></li> 
      <li><a href="#" onclick="toggleStuff('size'); return false;">Size</a></li> 
     </ul> 
     </div> 

     <div class="content"> 
     <p><span id="pic1" style="display: none;"><img src="1.jpg"></span></p> 
     <p><span id="description" style="display: none;">Cool!</span></p> 
     <p><span id="size" style="display: none;"><img src="2.jpg"></span></p> 
     </div> 


<script type="text/javascript"> 
function toggleStuff(id) { 
    if (document.getElementById(id).style.display == 'block') { 
    document.getElementById(id).style.display = 'none'; 
    } else { 
    document.getElementById(id).style.display = 'block'; 
    } 
} 
</script> 

Answer 1

はスタイル= "表示：なし" を削除します。

<p><span id="pic1"><img src="1.jpg"></span></p>