html - jQuery Increase image size without disrupting layout -
i have 2 lists of images before , after section. how can use jquery increase size of image clicked without disrupting layout of other images.
<div id="concept-reality-wrapper"> <div class="col-1"> <h2>concept</h2> <ul> <li> <img src="image.jpg" /> </li> <li> <img src="image.jpg" /> </li> <li> <img src="image.jpg" /> </li> <li> <img src="image.jpg" /> </li> <li> <img src="image.jpg" /> </li> <li> <img src="image.jpg" /> </li> </ul> </div> <div class="col-2"> <h2>reality</h2> <ul> <li> <img src="image.jpg" /> </li> <li> <img src="image.jpg" /> </li> <li> <img src="image.jpg" /> </li> <li> <img src="image.jpg" /> </li> <li> <img src="image.jpg" /> </li> <li> <img src="image.jpg" /> </li> </ul> </div> </div>
do with css only..you can see how it's done in gallery: http://dropthebit.com/demos/photobox/
basically use transform:scale() , doesn't effect scales thing.
Comments
Post a Comment