Форум Сайтостроение Веб-строительство

Не могу разобраться в коде смены картинок

12
S_A_N_T_A
На сайте с 23.11.2009
Offline
154
S_A_N_T_A
986

Скачал с интернета скрипт смены картинок:

<script language="JavaScript">

i=0;

img_a=new Array();

img_h=new Array();

img_a[0]=new Image();

img_a[1]=new Image();

img_a[0].src="http://site.ru/uploads/1.jpg";

img_a[1].src="http://site.ru/uploads/2.jpg";

function chImages()

{

document.getElementById('p1').src=img_a.src;
i=1-i;
animate(0,1,function(){
setTimeout(function(){
animate(1,0,function(){
chImages();
})},5000)})
//setTimeout("chImages()", 1000)
}
function animate(_from,_to,callback){
var i = 20,disp=(_from-_to)/i,interval=
setInterval(function(){
set_opacity('p1',_from-=disp);
if(!i--) {
clearInterval(interval);
callback()
}
},1000/i)
}
function set_opacity(op,id){
if(typeof(op)=='string') op=document.getElementById(op);
try{
op.style.opacity = id;
op.style.filter = 'alpha(opacity='+Math.ceil(id*300)+')';
} catch (e) {;}
}
</script>



<body onLoad="animate(1,0,function(){ chImages()})">
<img id="p1" src="http://site.ru/uploads/1.jpg">


Не могу разобраться как туда добавить ещё несколько картинок
Добавляю в код img_a[3]=new Image(); и img_a[1].src="http://site.ru/uploads/3.jpg"; - третья картинка не появляется

stiliar
На сайте с 04.03.2008
Offline
79
stiliar
#1
и img_a[1].src="http://site.ru/uploads/3.jpg";

Здесь, наверное, должно быть так: img_a[3].src="http://site.ru/uploads/3.jpg";

S_A_N_T_A
На сайте с 23.11.2009
Offline
154
S_A_N_T_A
#2

Так делал, ничего не получается, третья картинка не хочет появляться

S_A_N_T_A добавил 29.04.2010 в 15:30

PLEASE народ, срочно нужно

Станислав
На сайте с 27.12.2009
Offline
258
Станислав
#3

Точно не могу сказать но по моему к коду не хватает highslide.js

Попробуй сам .js подключить на странице

Мы там, где рады нас видеть.
S_A_N_T_A
На сайте с 23.11.2009
Offline
154
S_A_N_T_A
#4

Нет, проблема точно не в этом, так как сам код срабатывает и картинки меняются с затуханием и так как нужно, но проблема в, том что не могу добавить большее число картинок(((

Срочно нужно, уже около 5ти часов долблюсь(((((

eTarget 2011:Панельная дискуссия «Стратегия eTarget 2011: Круглый стол Могут ли «плохие» входящие
Станислав
На сайте с 27.12.2009
Offline
258
Станислав
#5

Аааа, а так пробывал?

img_a=new Array();
img_h=new Array();
img_a[0]=new Image();
img_a[1]=new Image();
img_a[2]=new Image();
img_a[3]=new Image();
img_a[4]=new Image();
img_a[0].src="http://site.ru/uploads/1.jpg";
img_a[1].src="http://site.ru/uploads/2.jpg";
img_a[2].src="http://site.ru/uploads/3.jpg";
img_a[3].src="http://site.ru/uploads/4.jpg";
img_a[4].src="http://site.ru/uploads/5.jpg";
function chImages()
{
document.getElementById('p1').src=img_a.src;
i=1-i;
animate(0,1,2,3,4,function(){
setTimeout(function(){
animate(4,3,2,1,0,function(){
chImages();

И здесь еще вот так

<body onLoad="animate(4,3,2,1,0,function(){ chImages()})">
S_A_N_T_A
На сайте с 23.11.2009
Offline
154
S_A_N_T_A
#6

Именно так не пробовал, но сейчас попробовал - так картинки вообще не меняются, одна стоит на месте и всё... но всё равно спасибо...))

S_A_N_T_A добавил 29.04.2010 в 16:31

тема актуальна, решить проблему не удалось((

stiliar
На сайте с 04.03.2008
Offline
79
stiliar
#7

Вот этот вроде работает. По аналогии можно добавить сколько хочешь картинок. 

<HTML>

<HEAD>

<TITLE> New Document </TITLE>

<script language=javaScript>

<!-- Beginning of JavaScript -



sandra0 = new Image();

sandra0.src = "1.jpg";



sandra1 = new Image();

sandra1.src = "2.jpg";



sandra2 = new Image();

sandra2.src = "3.jpg";



sandra3 = new Image();

sandra3.src = "4.jpg";



var i_strngth=(document.getElementById)?0:1;

var i_image=0



var imageurl = new Array()

imageurl[0] ="1.jpg"

imageurl[1] ="2.jpg"

imageurl[2] ="3.jpg"

imageurl[3] ="4.jpg"





function showimage() {

    if(document.all) {

        if (i_strngth <=110) {

            testimage.innerHTML="<img style='filter:alpha(opacity="+i_strngth+")' src="+imageurl[i_image]+" border=0>";

            i_strngth=i_strngth+10

            var timer=setTimeout("showimage()",100)

        }

        else {

            clearTimeout(timer)

            var timer=setTimeout("hideimage()",1000)

        }

    }

    if (document.getElementById&&!document.all)

    {



            if (i_strngth <1) {

            //alert(i_strngth)

            testimage.innerHTML="<img style='opacity:"+i_strngth+"' src="+imageurl[i_image]+" border=0>";

            i_strngth=i_strngth+0.1

            var timer=setTimeout("showimage()",100)

        }

        else {



            clearTimeout(timer)

            var timer=setTimeout("hideimage()",1000)

        }

    }



    if(document.layers) {

            clearTimeout(timer)

            document.testimage.document.write("<img src="+imageurl[i_image]+" border=0>")

            document.close()

            i_image++

            if (i_image >= imageurl.length) {i_image=0}

            var timer=setTimeout("showimage()",2000)



    }



}





function hideimage() {

    if (document.all&&i_strngth >=-10) {

        testimage.innerHTML="<img style='filter:alpha(opacity="+i_strngth+")' src="+imageurl[i_image]+" border=0>";

        i_strngth=i_strngth-10

        var timer=setTimeout("hideimage()",100)

    }

        else if(document.getElementById&&!document.all&&i_strngth>0.1)

        {



      testimage.innerHTML="<img style='opacity:"+i_strngth+"' src="+imageurl[i_image]+" border=0>";

        i_strngth=i_strngth-0.1;

        var timer=setTimeout("hideimage()",100)

        }

    else {



        clearTimeout(timer)

        i_image++

        if (i_image >= imageurl.length) {i_image=0}

        i_strngth=(document.getElementById)?0:1;

        if (document.getElementById&&!document.all)

        showimage();

        else

        var timer=setTimeout("showimage()",500)



    }

}





// - End of JavaScript - -->

</script>

</HEAD>



<body bgcolor="#FFFFFF" onLoad="showimage()">



<div id="mainbod" style="position:absolute;visibility:visible;top:50px;left:360px;">



</div>



<div id="testimage" style="position:absolute;visibility:visible;top:50px;left:40px"></div>

</body>

</HTML>

Пути только свои подставишь к картинкам imageurl[0] ="http://site.ru/uploads/1.jpg". Я на локале проверял.

S_A_N_T_A
На сайте с 23.11.2009
Offline
154
S_A_N_T_A
#8

stiliar, Спасибо огромное, всё работает, пока поставлю этот скрипт.

Но если кто то знает как исправить 1ый скрипт прошу подсказать, так как скрипт от stiliar громоздкий и слишком грузит сервак

S_A_N_T_A добавил 29.04.2010 в 17:37

stiliar, Выпучил :)

L
На сайте с 07.12.2007
Offline
351
Ladycharm
#9
S_A_N_T_A:
Но если кто то знает как исправить 1ый скрипт прошу подсказать,
Конструкция
i=0;
. . . . .
i=1-i;
позволяет i принимать значения 1 или 0, а конструкция:
animate(0,1,function(){
setTimeout(function(){
animate(1,0,function(){
chImages();
})
},5000)
})
явно переключает 0 или 1 картинку (0,1) и (1,0).

Просто так картинки не добавить, надо переписывать функции в общем виде.
S_A_N_T_A
На сайте с 23.11.2009
Offline
154
S_A_N_T_A
#10

Теперь буду знать, спс :)

12

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий