Страниц (2): [1] 2 » |
|
Без описания |
Поиск в теме | Версия для печати |
Дмитрий Б. |
Отправлено: 21 Сентября, 2006 - 06:42:09
|
Super Member
Покинул форум
Сообщений всего: 800
Дата рег-ции: Март 2005
Откуда: Иркутск
Карма 0
|
Str
CODE:<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=windows-1251">
<title>Фотогалерея</title>
<script type="text/javascript">
<!--
var filesNames=
[
'image1.jpg',
'image2.jpg',
'image3.jpg',
'image4.jpg',
'image5.jpg'
];
var path='images/';
var current=0, activeImages=3, imagesShift=2;
var preloadedImages;
function main()
{
var i;
preloadedImages=new Array(filesNames.length);
for (i=0; i<filesNames.length; i++)
preloadedImages[i]=new Image();
preloadCurrent();
setTimeout(preload, 1000);
}
function preloadCurrent()
{
for (var i=current; i<current+activeImages; i++)
if (!preloadedImages[i%preloadedImages.length].src)
preloadedImages[i%preloadedImages.length].src=path+filesNames[i%preloadedImages.length];
}
function preload()
{
var i, currentLoads=0;
for (i=0; i<preloadedImages.length; i++)
if (preloadedImages[i].src&&(!preloadedImages[i].complete))
currentLoads++;
for (i=current+activeImages; (currentLoads<activeImages)&&(i<preloadedImages.length); i++)
if (!preloadesImages[i].src)
{
preloadedImages[i].src=path+filesNames[i];
currentLoads++;
}
for (i=0; (currentLoads<activeImages)&&(i<current); i++)
if (!preloadesImages[i].src)
{
preloadedImages[i].src=path+filesNames[i];
currentLoads++;
}
for (i=0; i<preloadedImages.length; i++)
if (!preloadedImages[i].src)
return setTimeout(preload, 1000);
}
function back()
{
current-=imagesShift;
while (current<0)
current+=filesNames.length;
preloadCurrent();
var i, j, a;
for (i=current; (i-current)<activeImages; i++)
{
if (a=document.getElementById('image'+(i-current+1)))
a.src=preloadedImages[i%preloadedImages.length].src;
else
window.status='Ошибка при задании тегов <img>...';
}
}
function forward()
{
current+=imagesShift;
while (current>=filesNames.length)
current-=filesNames.length;
preloadCurrent();
var i, a;
for (i=current; (i-current)<activeImages; i++)
{
if (a=document.getElementById('image'+(i-current+1)))
a.srcreloadedImages[i%preloadedImages.length].src;
else
window.status='Ошибка при задании тегов <img>...';
}
}
main();
//-->
</script>
</head>
<body>
<table width="400" align="center">
<tr>
<td width="33%">
<img src="images/image1.jpg" id="image1">
</td>
<td width="33%">
<img src="images/image2.jpg" id="image2">
</td>
<td width="33%">
<img src="images/image3.jpg" id="image3">
</td>
</tr>
</table>
<input type="button" value="Назад" onclick="back();">
<input type="button" value="Вперёд" onclick="forward();">
</body>
</html>
Здесь filesNames - массив имён файлов, path - путь к картинкам, current - начальная позиция, activeImages - число отображаемых картинок, imagesShift - на сколько картинок происходит сдвиг вперёд или назад. |
|
|
Дмитрий Б. |
Отправлено: 21 Сентября, 2006 - 10:05:50
|
Super Member
Покинул форум
Сообщений всего: 800
Дата рег-ции: Март 2005
Откуда: Иркутск
Карма 0
|
Str
Пардон, не проверил скрипт во всех браузерах - думал, он настолько прост, что этого не потребуется. Я ошибался... Ну не везёт мне с Оперой - одним словом, любит она меня! Снова и снова...
Межбраузерный код выглядит вот так:
CODE:<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=windows-1251">
<title>Фотогалерея</title>
<script type="text/javascript">
<!--
var filesNames=
[
'image1.jpg',
'image2.jpg',
'image3.jpg',
'image4.jpg',
'image5.jpg'
];
var path='images/';
var current=0, activeImages=3, imagesShift=2;
var preloadedImages;
function main()
{
var i;
preloadedImages=new Array(filesNames.length);
for (i=0; i<filesNames.length; i++)
preloadedImages[i]=new Image();
preloadCurrent();
show();
setTimeout(preload, 1000);
}
function hasSrc(image)
{
return image.src&&(image.src.lastIndexOf('.')>image.src.lastIndexOf('/'));
}
function preloadCurrent()
{
var i, src;
for (i=current; i<current+activeImages; i++)
if (!hasSrc(preloadedImages[i%preloadedImages.length]))
preloadedImages[i%preloadedImages.length].src=path+filesNames[i%preloadedImages.length];
}
function preload()
{
var i, currentLoads=0;
for (i=0; i<preloadedImages.length; i++)
if (hasSrc(preloadedImages[i])&&(!preloadedImages[i].complete))
currentLoads++;
for (i=current+activeImages; (currentLoads<activeImages)&&(i<preloadedImages.length); i++)
if (!hasSrc(preloadedImages[i]))
{
preloadedImages[i].src=path+filesNames[i];
currentLoads++;
}
for (i=0; (currentLoads<activeImages)&&(i<current); i++)
if (!hasSrc(preloadedImages[i]))
{
preloadedImages[i].src=path+filesNames[i];
currentLoads++;
}
for (i=0; i<preloadedImages.length; i++)
if (!hasSrc(preloadedImages[i]))
return setTimeout(preload, 1000);
}
function back()
{
current-=imagesShift;
while (current<0)
current+=filesNames.length;
preloadCurrent();
show();
}
function forward()
{
current+=imagesShift;
while (current>=filesNames.length)
current-=filesNames.length;
preloadCurrent();
show();
}
function show()
{
var i, a;
for (i=current; (i-current)<activeImages; i++)
{
if (a=document.getElementById('image'+(i-current+1)))
a.src=preloadedImages[i%preloadedImages.length].src;
else
window.status='Ошибка при задании тегов <img>...';
}
}
//-->
</script>
</head>
<body onload="main();">
<table width="400" align="center">
<tr>
<td width="33%">
<img src="images/image1.jpg" id="image1">
</td>
<td width="33%">
<img src="images/image2.jpg" id="image2">
</td>
<td width="33%">
<img src="images/image3.jpg" id="image3">
</td>
</tr>
</table>
<input type="button" value="Назад" onclick="back();">
<input type="button" value="Вперёд" onclick="forward();">
</body>
</html>
З. Ы. Если будете читать - не удивляйтесь: hasSrc нужен, чтобы в Opera 7.23 работало... |
|
|
Дмитрий Б. |
Отправлено: 21 Сентября, 2006 - 21:52:20
|
Super Member
Покинул форум
Сообщений всего: 800
Дата рег-ции: Март 2005
Откуда: Иркутск
Карма 0
|
Str
Элементарно!
CODE:<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=windows-1251">
<title>Фотогалерея</title>
<script type="text/javascript">
<!--
var slideshows=
[
{
filesNames:
[
'image1.jpg',
'image2.jpg',
'image3.jpg',
'image4.jpg',
'image5.jpg'
],
path: 'images/',
idPrefix: 'image',
current: 0,
activeImages: 3,
imagesShift: 2,
preloadedImages: null
},
{
filesNames:
[
'image1.jpg',
'image2.jpg',
'image3.jpg',
'image4.jpg',
'image5.jpg'
],
path: 'slides/',
idPrefix: 'slide',
current: 0,
activeImages: 3,
imagesShift: 1,
preloadedImages: null
}
];
function main()
{
var i, n;
for (n=0; n<slideshows.length; n++)
with (slideshows[n])
{
preloadedImages=new Array(filesNames.length);
for (i=0; i<filesNames.length; i++)
preloadedImages[i]=new Image();
preloadCurrent(n);
show(n);
setTimeout('preload('+n+')', 1000);
}
}
function hasSrc(image)
{
return image.src&&(image.src.lastIndexOf('.')>image.src.lastIndexOf('/'));
}
function preloadCurrent(n)
{
with (slideshows[n])
{
var i, src;
for (i=current; i<current+activeImages; i++)
if (!hasSrc(preloadedImages[i%preloadedImages.length]))
preloadedImages[i%preloadedImages.length].src=path+filesNames[i%preloadedImages.length];
}
}
function preload(n)
{
with (slideshows[n])
{
var i, currentLoads=0;
for (i=0; i<preloadedImages.length; i++)
if (hasSrc(preloadedImages[i])&&(!preloadedImages[i].complete))
currentLoads++;
for (i=current+activeImages; (currentLoads<activeImages)&&(i<preloadedImages.length); i++)
if (!hasSrc(preloadedImages[i]))
{
preloadedImages[i].src=path+filesNames[i];
currentLoads++;
}
for (i=0; (currentLoads<activeImages)&&(i<current); i++)
if (!hasSrc(preloadedImages[i]))
{
preloadedImages[i].src=path+filesNames[i];
currentLoads++;
}
for (i=0; i<preloadedImages.length; i++)
if (!hasSrc(preloadedImages[i]))
return setTimeout('preload('+n+')', 1000);
}
}
function back(n)
{
with (slideshows[n])
{
current-=imagesShift;
while (current<0)
current+=filesNames.length;
preloadCurrent(n);
show(n);
}
}
function forward(n)
{
with (slideshows[n])
{
current+=imagesShift;
while (current>=filesNames.length)
current-=filesNames.length;
preloadCurrent(n);
show(n);
}
}
function show(n)
{
with (slideshows[n])
{
var i, a;
for (i=current; (i-current)<activeImages; i++)
{
if (a=document.getElementById(idPrefix+(i-current+1)))
a.src=preloadedImages[i%preloadedImages.length].src;
else
window.status='Ошибка при задании тегов <img>...';
}
}
}
//-->
</script>
</head>
<body onload="main();">
<table width="400" align="center">
<tr>
<td width="33%">
<img src="images/image1.jpg" id="image1">
</td>
<td width="33%">
<img src="images/image2.jpg" id="image2">
</td>
<td width="33%">
<img src="images/image3.jpg" id="image3">
</td>
</tr>
</table>
<input type="button" value="Назад" onclick="back(0);">
<input type="button" value="Вперёд" onclick="forward(0);">
<table width="400" align="center">
<tr>
<td width="33%">
<img src="images/image1.jpg" id="slide1">
</td>
<td width="33%">
<img src="images/image2.jpg" id="slide2">
</td>
<td width="33%">
<img src="images/image3.jpg" id="slide3">
</td>
</tr>
</table>
<input type="button" value="Назад" onclick="back(1);">
<input type="button" value="Вперёд" onclick="forward(1);">
</body>
</html> |
|
|
|
Поиск в теме | Версия для печати |
Страниц (2): [1] 2 » |
Сейчас эту тему просматривают: 1 (гостей: 1, зарегистрированных: 0, скрытых: 0) |
« JavaScript » |
Все гости форума могут просматривать этот раздел. Только администраторы и модераторы могут создавать новые темы в этом разделе. Только администраторы и модераторы могут отвечать на сообщения в этом разделе.
|
|
|