javascript - Using toggleClass to toggle between image heights, 250px - 450px? -


i building website image heavy, portfolio site.

i have masonry type gallery each image set 250px height default. wish create hyperlink/button let user decide if want view images @ normal size (250px) or @ larger size (450px).

the images loaded inside div called #imagegallery, understand best way have button once clicked, add/toggle/remove class resize images in div 450px.

seems basic usage of toggleclass jquery function.

$('#togglebtn').click(function(){    $('.item').toggleclass( "expand" );    });
.item{    height:250px;  }  .expand{    height:450px;    }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <button id="togglebtn">toggle</button>  <div id="imagegallery">    <img class="item" src="https://encrypted-tbn0.gstatic.com/images?q=tbn:and9gcrabcf7stpcrmmzxkwuyopewievnyqzvvtj_f79-zj0tfscn5njuq" />    <img class="item" src="https://encrypted-tbn0.gstatic.com/images?q=tbn:and9gcrabcf7stpcrmmzxkwuyopewievnyqzvvtj_f79-zj0tfscn5njuq" />  </div>


Comments

Popular posts from this blog

javascript - Clear button on addentry page doesn't work -

c# - Selenium Authentication Popup preventing driver close or quit -

tensorflow when input_data MNIST_data , zlib.error: Error -3 while decompressing: invalid block type -