| |
|
|
| | Народ подскажите как зделать
есть к примеру база с картинками
и к примеру на сайте таблица 200 Х 200 положем и в ней плавно перетикая будут прокручиваться все картинки из базы в хоотичном порядке !! ЗАРАНЕЕ БЛОГАДАРЮ! | |
| |
|
|
| |
|
|
| |
для: sidPR
(25.10.2005 в 16:11)
| | | Однозначно, что делать это надо слоях: в таблицу попестить слой (А) тоже 200 на 200 (ну или 100% на 100%) дать ему style="posution:relative;overflow : hidden;". Этот слой будет контейнером для движущегося слоя (что-то вроде маски маской, как во флеш). Соответственно помесить в слой А слой Б (left:0;top:0), и дать ему posution:absolute и если не ошибаюсь для слоя Б тогда облостью измерения станет слой А. Ну натолкать в слой Б картинок в хоотичном порядке (это уж или на сервере или на клиенте, решать вам) и запустить медленное движение слоя (по X, по Y зависит от желания). Вопрос с зацикливанием: тут или под конец моментально перебрасывать назад и прокручивать заново или запускать в обратном напралении (тут уж я не знаю какой у вас заысел). | |
| |
|
|
| |
|
|
| |
для: multiBrain
(25.10.2005 в 17:36)
| | | Тут ключевое слово - "плавно перетИкая", т.е. постановщик хочет эффект пропадания прежней и появления новой ("наплыв" в кинематографии). Это делается через стиль opacity (который в Opera не работает). Ну и что? Я бы взял 5 слоёв, написал эффект наплыва слоя i+1 на слой i. Дальше интереснее. База предполагаю, что большая. 5 слоёв выбрал не для хеширования, а для очереди показов. Т.е. вначале подгружается в них 5 картинок до запуска скрипта. Как только освобождается i-я картинка, в слой вносится новая из базы методом динамической генерации скрипта вида loadImg.src='имя_файла.jpg'; - без перезагрузки страницы, аналогично JSHttp0Request, но вместо файла *.js - loadImg=new Image; . Далее, вносится в слой и слою приписывается z-index, на 1 больший, чем максимальный (начальный - 4). Этот слой ждёт своего часа показа. Надо, конечно, следить за оффлайном. Если бы такая задача встала коммерчески, я бы запросил на неё 3 дня, из них 2- на отладку.
Если проще, то обычно грузят N картинок из базы, а потом обходятся 2 слоями в аналогичном цикле без подпитки. | |
| |
|
|
| |
|
|
| |
для: sidPR
(25.10.2005 в 16:11)
| | | Как альтернативу можно еще рассмотреть флеш. С хоотичностью посложнее будет, зато можно сделать эффекты поинтереснее. | |
| |
|
|
| |
|
|
| |
для: multiBrain
(25.10.2005 в 18:54)
| | | Нашел тут такой вот скрипт очень эфектный красиво заменяються. Предлогаю общими усилиями переделать его чтобы он взаимодействовал с SQL и вытаскивал оттуда в хоотичном порядке изображения или линки на изображения..
и проигрывал...
<!-- HEAD START HERE -->
<SCRIPT LANGUAGE="JavaScript">
// Set slideShowSpeed (milliseconds)
var slideShowSpeed = 5000;
// Duration of crossfade (seconds)
var crossFadeDuration = 3;
// Specify the image files
var Pic = new Array();
// to add more images, just continue
// the pattern, adding to the array below
Pic[0] = '1.jpg'
Pic[1] = '2.jpg'
Pic[2] = '3.jpg'
Pic[3] = '4.jpg'
Pic[4] = '5.jpg'
// do not edit anything below this line
var t;
var j = 0;
var p = Pic.length;
var preLoad = new Array();
for (i = 0; i < p; i++) {
preLoad[i] = new Image();
preLoad[i].src = Pic[i];
}
function runSlideShow() {
if (document.all) {
document.images.SlideShow.style.filter="blendTrans(duration=2)";
document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)";
document.images.SlideShow.filters.blendTrans.Apply();
}
document.images.SlideShow.src = preLoad[j].src;
if (document.all) {
document.images.SlideShow.filters.blendTrans.Play();
}
j = j + 1;
if (j > (p - 1)) j = 0;
t = setTimeout('runSlideShow()', slideShowSpeed);
}
// End -->
</script>
<!-- HEAD END HERE -->
</head>
<body bgcolor="#EDEDED" text="#000000" link="#000000" topmargin="0" leftmargin="0" onLoad="runSlideShow()">
<center>
<!-- BODY START HERE -->
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="VU" height=150 width=150>
<img src="1.jpg" name='SlideShow' width=150 height=150>
</td>
</tr>
</table>
</body>
</html>
|
| |
| |
|
|
