css3 grid images combined with responsive modal ?

I've been using the CSS3 Grid Images - Fluid Scale, Responsive from Beverly.

I was wondering if it's possible to combine it with the Responsive Modal Overlay/ Pop-up Image Viewer

Is it possible to use this code with percentages like instead of making smaller images too, use the code but on the smaller images use 30% and on the larger images use 100%? Meaning I have say 50 photos and rather than resizing them all to be a smaller size for the image grid.

but I want the smaller images in the gallery to popup lighbox ? in a window to view the larger images

thanks in advance

What have you tried yourself? Somebody already did the hard part so all you need to do is put the pieces together. If you're combining the scripts, post a demo of your own attempt. It looks easy enough if you start with the grid page and copy in the parts for the modal popup.

The grid works with any size images already thanks to background-size:cover in the CSS. And it looks like you can use any image in the modal popup. It could be the same as the grid images or any other.

Thank you

If you haven't yet done this yourself, here is a combined version: http://fofwebdesign.co.uk/template/_...-popup-rwd.htm

thanks Beverly