Search code examples
javascriptcsshtmlphoto-gallery

open thumbnails in larger div

hej there, I've got a question about functions of javascript and css.

I am trying to creat a css photo gallery, but I found out that a good gallery with thumbnails etc. is almost not possible in css only. So I want, when I click on the thumbnail, the picture opens bigger in another div.

I hope it's clear enough like this.

I am sorry for the bad english.

Solution

  • html

    <a.some>
   <img.thumb>
   <span.popup>
      <img.big>
   </span>
</a>

    css

    a.some{position:relative}
a.some .popup{display: none;}
a.some:focus .popup{
   display:block;
}

    something like this.