Jquery плагин галереи PrettyPhoto

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js" type="text/javascript"></script>
<script src="{tpl_url}/js/jquery.prettyPhoto.js" type="text/javascript" charset="utf-8"></script>

 <link rel="stylesheet" href="{tpl_url}/css/prettyPhoto.css" type="text/css" media="screen"   />

 <ul class="gallery clearfix">
    <li><a href="{tpl_url}/images/fullscreen/1.jpg" rel="prettyPhoto[gallery1]
 
" title="Описание снизу"><img src="{tpl_url}/images/thumbnails/t_1.jpg" width="60" height="60" alt="Название вверху" /></a></li>
    <li><a href="{tpl_url}/images/fullscreen/2.jpg" rel="prettyPhoto[gallery1]
 
"><img src="{tpl_url}/images/thumbnails/t_2.jpg" width="60" height="60" alt="Название вверху" /></a></li>
    ...
</ul>

 </body>

 <script type="text/javascript">
    $(document).ready(function(){
        $("a[rel^='prettyPhoto']").prettyPhoto();
    });
</script>

 <script type="text/javascript">
    $(document).ready(function(){
        $(".gallery:first a[rel^='prettyPhoto']").prettyPhoto({
            animation_speed:'normal',//скорость анимации
            theme:'light_square',//тема оформления
            slideshow:3000,//время показа слайда
            autoplay_slideshow: true//автоматический старт слайдшоу
        });
    });
</script>

 <a href="http://www.youtube.com/watch?v=kh29_SERH0Y?rel=0" rel="prettyPhoto" title="YouTube видео">Видео с YouTube</a>

 <a href="#block" rel="prettyPhoto" title="Контент">Контент из блока с id=block</a>

 pp_titles = (isSet) ? jQuery.map(matchedObjects, function(n, i){ if($(n).attr(settings.hook).indexOf(theRel) != -1) return ($(n).find('img').attr('alt')) ? $(n).find('img').attr('alt') : ""; }) : $.makeArray($(this).find('img').attr('alt'));
pp_descriptions = (isSet) ? jQuery.map(matchedObjects, function(n, i){ if($(n).attr(settings.hook).indexOf(theRel) != -1) return ($(n).attr('title')) ? $(n).attr('title') : ""; }) : $.makeArray($(this).attr('title'));

 pp_titles = (isSet) ? jQuery.map(matchedObjects, function(n, i){ if($(n).attr(settings.hook).indexOf(theRel) != -1) return ($(n).find('div.description').html()) ? $(n).find('div.description').html() : ""; }) : $.makeArray($(this).find('div.description').html());
pp_descriptions = (isSet) ? jQuery.map(matchedObjects, function(n, i){ if($(n).attr(settings.hook).indexOf(theRel) != -1) return ($(n).find('div.title').html()) ? $(n).find('div.title').html() : ""; }) : $.makeArray($(this).find('div.title').html());

 <a href="images/fullscreen/1.jpg" rel="prettyPhoto[gallery1]">
    <img src="images/thumbnails/t_1.jpg" width="60" height="60" alt="Изображение 1" />
    <div class="title" style="display: none;">Название</div>
    <div class="description" style="display: none;">Описание</div>
</a>