ギャラリーを開いてサムネイルを選択したとき

Question

サムネイルを選択したときにギャラリーを開くためにコードを追加しようとしています。 は、今私はサムネイルが選択されるたびに、ギャラリーやカルーセルを開きたい、今すぐこのライン

<div class="row"> 

     <div class="col-lg-12"> 
      <h1 class="page-header">Thumbnail Gallery</h1> 
     </div> 

     <div class="col-lg-3 col-md-4 col-xs-6 thumb"> 
      <a class="thumbnail" href="#"> 
       <img class="img-responsive" src="images/idee-bianco.png" alt=""> 
      </a> 
     </div> 
     <div class="col-lg-3 col-md-4 col-xs-6 thumb"> 
      <a class="thumbnail" href="#"> 
       <img class="img-responsive" src="images/idee-bianco.png" alt=""> 
      </a> 
     </div> 
     <div class="col-lg-3 col-md-4 col-xs-6 thumb"> 
      <a class="thumbnail" href="#"> 
       <img class="img-responsive" src="images/idee-bianco.png" alt=""> 
      </a> 
     </div> 
    ........ 

    </div> 

を持っています。 これはポートフォリオですので、各サムネイルは写真、ビデオ、イラストなど、さまざまなものを表しています。

ブートストラップのCSSはほとんどの場合、デフォルトでjsと同じです。 おかげ

Answer 1

は、ここでは、この

<div class="col-lg-12 gallery"> 
    <h1 class="page-header">Thumbnail Gallery</h1> 
</div> 

<div class="col-lg-3 col-md-4 col-xs-6 thumb"> 
    <a class="thumbnail" href="#"> 
     <img class="img-responsive" src="images/idee-bianco.png" alt="" onclick = "Show()"> 
    </a> 
</div> 

<style> 
.gallery{ 
    display: none; // gallery is not visible normally 
} 
</style> 
<script> 
function Show(){ 
    document.getElementsByClass('gallery').style.display = 'block'; 
</script> 

を試してみて、ユーザーが画像をクリックすると、あなたはクラスギャラリーの表示プロパティを操作ショーの機能を呼び出しています。この関数はクラス 'gallery'に属するすべての要素に影響します。自分のIDを使用して、あなたのページにこのようなギャラリーを1つだけ持つようにします。