это делается с помощью библеотеки lightbox скачать можно
здесь
Используем так
между тегами <head></head> добавляем
Код:
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
В lightbox.
js и css правим пути для сужебных избражении prev.gif next.gif loading.gif close.gif
Прикручиваем к любому изображению так
Код:
<a href=”ССЫЛКА НА САМО ИЗОБР.” rel=”lightbox” title=”my caption”><img src=” ПУТЬ ДО ПРЕВЬЮ”></a>
если хочешь группой изображеии то в теге rel нужно указать имя группы так: rel='lightbox[название группы]'