<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-us">
<head>
<title>Carousel Images</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<script src="http://psiwebdiz.ru/yrok/skin/jquery-1.3.2.min.js" type="text/javascript"></script>
<script type="text/javascript" src="http://psiwebdiz.ru/yrok/skin/jquery.jcarousel.pack.js"></script>
<script type="text/javascript" src="http://psiwebdiz.ru/yrok/skin/thickbox.js"></script>
<link rel="stylesheet" type="text/css" href="http://psiwebdiz.ru/yrok/skin/skin.css" />
<script type="text/javascript">
tb_pathToImage = "skin/loading.gif";
var mycarousel_itemList = [
{url: "http://psiwebdiz.ru/yrok/skin/loading.gif", title: "Изображение тестирования и настройки Карусели 1"},
{url: "photo/image02.jpg", title: "Изображение 2"},
{url: "http://psiwebdiz.ru/yrok/skin/next.png", title: "Изображение 3"},
{url: "photo/image04.jpg", title: "Изображение 4"},
{url: "photo/image05.jpg", title: "Изображение 5"},
{url: "photo/image06.jpg", title: "Изображение 6"},
{url: "photo/image07.jpg", title: "Изображение 7"},
{url: "photo/image08.jpg", title: "Изображение 8"},
{url: "photo/image09.jpg", title: "Изображение 9"},
{url: "photo/image10.jpg", title: "Изображение 10"}
];
function mycarousel_itemLoadCallback(carousel, state)
{
for (var i = carousel.first; i <= carousel.last; i++) {
if (carousel.has(i)) {
continue;
}
if (i > mycarousel_itemList.length) {
break;
}
var item = jQuery(mycarousel_getItemHTML(mycarousel_itemList[i-1])).get(0);
tb_init(item);
carousel.add(i, item);
}
};
function mycarousel_getItemHTML(item)
{
var url_m = item.url.replace(/_s.jpg/g, '_m.jpg');
return '<a href="' + url_m + '" title="' + item.title + '"><img src="' + item.url + '" width="80" height="60" border="0" alt="' + item.title + '" /></a>';
};
jQuery(document).ready(function() {
jQuery('#mycarousel').jcarousel({
size: mycarousel_itemList.length,
itemLoadCallback: {onBeforeAnimation: mycarousel_itemLoadCallback}
});
});
</script>
</head>
<body>
<div id="wrap"><center>
<h1>Галерея изображений "Карусель"</h1>
<p>Для полноразмерного просмотра изображения <br> - нужно сделать клик по его миниатюре.</p>
<ul id="mycarousel" class="jcarousel-skin-a"></ul>
<br>
<a href="tabs_500.html">Вернуться к описанию</a>
</center>
</div>
</body>
</html>
$POWERED_BY$
