Developing.ru

В общем, проблема такая. Нужен javascript, который будет заменять одну картинку на другую (с постепенным переходом одной в другую) н-ное количество раз. Типа слайд-шоу. Нужен именно javascript, так как надо будет его вставлять в CMS (из-за этого отвергли идею с флэш). Если кто знает, где такой можно найти, буду очень признателен.

с постепенным переходом одной в другую? это как?

Oniks,
с постепенным переходом одну в другую - либо невозможно, либо если и можно, то только по ИЕ (графические фильтры).

Если уж совсем нечего делать, то можно на сервере картинки (тем же php) резать на кусочки, и по кусочку менять ...

Если просто картинку одну на другую менять - без проблем, скажи, напишу за 5 минут.

Возможно. Я делал. Да, нужны фильтры (мне нравился alpha, например, меняющий прозрачность). Не проверял, на кроссбраузерность, но ИЕ это точно! Максзон = ИЕ -> работать будет, а на счет Оперы, например, сомневаюсь...

Давно я ничего не писал на JS и в HTML - повзрослел!!! Но смутно помню дело было так...

HTML:
<div id = myDIV style="filter:alpha(enabled = 1, opacity = 90)">...</div>

JS:
myDIV.style.filters(1)...

Нужно подробнее?

Sokl писал(а):Давно я ничего не писал на JS и в HTML - повзрослел!!!

Ну ты крут, а вот на мой ламерский взгляд, js очень удобен в некторых вещах....Да будут твои руки прямыми много чего сделать можно...

А по поводу фильтров это вообще-то DHTML, lol...

Duncon, умыл... DHTML... А я-то столько живу и не знаю, что превращает простой HTML в динамический... Неужели и вправду скрипты??? О... Чувствую глаза мои раскрываются... Спасибо!

В догонку! Весь этот ХА-ТЭ-ЭМ-ЭЛь я забросил по необходимости: "мерина" я на сайтах не заработал, сколько бы мегабайт не заскриптовал...
В какой-то момент всё, что я знаю, стало казаться таким несерьёзным (HTML, в том числе Dynamic, JS, VBS, FlashScript, CGI(Perl, C, ObjectPascal), PHP, ASP...) по сравнению с "большой" жизнью, в которую мне удалось "пробиться", а, вернее, в которую меня взяли, не смотря на все моё JavaScriptовое прошлое...

"JavaScript очень удобен в некоторых вещах..." - да, блин, в каких вещах может быть практическая польза от JavaScript???...

Ну вот незнаю мне и за html платили и платят...
FlashScript без самого флеша полная шляпа, а вообще flash -просто космическая штука, я сейчас сним плотно работать стал, - очень крутые возможности, но неудобный....

--"JavaScript очень удобен в некоторых вещах..." - да, блин, в каких вещах может быть практическая польза от JavaScript???...
Ну например проверки ввода текста делать, ну много чего перечислять лень...
А чисто практическая мощь языка я ощутил по полной, ну к примеру 1 плюс о котором все знают - js самый защищенный язык web(только не надо забывать, что за собой он следит, а вот на броузер ему нас*ать)
Далее практическая мощь и польза, я уже хвастался тут где-то, что на нем интернет магазин написал в далеком прошлом, так что гнать не стоит js foreva (долгое время был моим любимым языком)..
При желании могу еще и про прелести остальных языков поведать...(Актомя CGI Perl - не работал..)

Oniks писал(а):В общем, проблема такая. Нужен javascript, который будет заменять одну картинку на другую (с постепенным переходом одной в другую) н-ное количество раз. Типа слайд-шоу. Нужен именно javascript, так как надо будет его вставлять в CMS (из-за этого отвергли идею с флэш). Если кто знает, где такой можно найти, буду очень признателен.

В общем, есть два варианта такого скрипта. Один сам крутит, но только баннер, другой крутит, html файлы, но по клику пользователя.

Заодно может кто подскажет как сделать среднее, чтобы крутились файлы, но сами?

Вот первый:

<SCRIPT LANGUAGE="JavaScript">
<!-- Beginning of JavaScript -

// The file-names of your slideshow's images
var imgsname = new Array()
imgsname[0]="backpic1253.jpg"
imgsname[1]="backpic2253.jpg"
imgsname[2]="backpic3253.jpg"

// the links for each image
var imgsurl = new Array()
imgsurl[0]="http://www.woweb.ru"
imgsurl[1]="http://www.woweb.ru"
imgsurl[2]="http://www.woweb.ru"

// Configure the distance to the left and top margin of the window (pixels)
var imgstop=20
var imgsleft=20

// Configure the speed of the transition effect. less means faster
var pause=80

// Configure the standstill-time of the images (seconds)
var standstill=1500

// Do not change the variables below this line
var imgpreload=new Array()
for (i=0;i<=imgsname.length-1;i++) {
imgpreload=new Image()
imgpreload.src=imgsname
}
var coverimage = new Array()
coverimage[0]="imgtranspoint0.gif"
coverimage[1]="imgtranspoint1.gif"
coverimage[2]="imgtranspoint2.gif"
coverimage[3]="imgtranspoint3.gif"
coverimage[4]="imgtranspoint4.gif"
coverimage[5]="imgtranspoint5.gif"
coverimage[6]="imgtranspoint6.gif"
coverimage[7]="imgtranspoint7.gif"
coverimage[8]="imgtranspoint8.gif"
var covimgpreload=new Array()
for (i=0;i<=coverimage.length-1;i++) {
covimgpreload=new Image()
covimgpreload.src=coverimage
}
var i_imgs=0
var i_loop=0
var thisurl=0
var timer
stamdstill=standstill*1000

function init() {
if (document.all) {
document.all.imgs.style.posTop=imgstop
document.all.imgs.style.posLeft=imgsleft
document.all.cover.style.posTop=imgstop
document.all.cover.style.posLeft=imgsleft
enlargehearts()
}

if (document.layers) {
document.imgs.top=imgstop
document.imgs.left=imgsleft
document.cover.top=imgstop
document.cover.left=imgsleft
enlargehearts()
}
}

function enlargehearts() {
if (i_loop<=coverimage.length-1) {
if (document.all) {
imgcover.src=coverimage[i_loop]
}
if (document.layers) {
document.cover.document.imgcover.src=coverimage[i_loop]
}
i_loop++
timer= setTimeout("enlargehearts()",pause)
}
else {
clearTimeout(timer)
i_loop--
timer= setTimeout("shrinkhearts()",standstill)
}
}

function shrinkhearts() {
if (i_loop>=0) {
if (document.all) {
imgcover.src=coverimage[i_loop]
}
if (document.layers) {
document.cover.document.imgcover.src=coverimage[i_loop]
}
i_loop--
timer= setTimeout("shrinkhearts()",pause)
}
else {
clearTimeout(timer)
i_loop=0
i_imgs++

if (i_imgs>=imgsname.length) {i_imgs=0}
if (document.all) {
imgsback.src=imgsname[i_imgs]
}
if (document.layers) {
document.imgs.document.imgsback.src=imgsname[i_imgs]
}
timer= setTimeout("enlargehearts()",(4*pause))
}
}

function gotourl() {
document.location.href=imgsurl[i_imgs]
}

// - End of JavaScript - -->
</SCRIPT>

<!-- BODY START HERE -->

<DIV ID="imgs" class="imgsstyle"><img width=163 height=163 name="imgsback" src="backpic1253.jpg" border="0" target="_blank"></DIV>
<DIV ID="cover" class="imgsstyle"><a href="javascript:gotourl()"><img width=163 height=163 name="imgcover" src="imgtranspoint0.gif" border="0" target="_blank"></a></DIV>

<!-- BODY END HERE -->

Второй не помещается, могу прислать на мыло!!!