<a href="ссылка_на_картинку_в_полном_размере" rel="lightbox"><img src="ссылка_на_превью" alt="немного_о_картинке_или_заголовок" border="0"></a>

<script type="text/javascript" src="lightbox.js"></script>

<a href="images/image-1.jpg" rel="lightbox" title="описание">image #1</a>

#lightbox{
    background-color:#eee;
    padding: 10px;
    border-bottom: 2px solid #666;
    border-right: 2px solid #666;
    }
#lightboxDetails{
    font-size: 0.8em;
    padding-top: 0.4em;
    }
#lightboxCaption{ float: left; }
#keyboardMsg{ float: right; }
 
#lightbox img{ border: none; }
#overlay img{ border: none; }

#overlay{ background-image: url(overlay.png); }

* html #overlay{
    background-color: #000;
    back\ground-color: transparent;
    background-image: url(blank.gif);
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="overlay.png", sizingMethod="scale");
    }

var loadingImage = 'loading.gif';

var closeButton = 'close.gif';