[JavaScript] Slide gallery Opcje

[--owen--]

Witam!

Chciałbym napisać na stronę skrypt który umożliwiał by zmianę w jednym miejscu trzech zdjęć. Tak by pierwsze było zdjęcie numer 1, potem 2, 3 i znowu wracało do pierwszego. Zacząłem pisać skrypt, ale już na poczatku mam problemy. Może ktoś mi podpowie czy w dobrą stronę idę i może czego użyć aby dzialalo. Ja napisze z mojej strony jak to widze.

[JAVASCRIPT] pobierz, plaintext 
zdj = new Array("url(../images/slideGallery/1.jpg)",
				"url(../images/slideGallery/2.jpg)",
				"url(../images/slideGallery/3.jpg)");
				var licznik = 0;
				const SEK = 1000;
				const ZM = 5*SEC;
				interwal = 0;
 
				function aa12() {
					var url = document.getElementById("c2");
					if(licznik < zdj.length){
							url.style.background = zdj[licznik];
						}else{
							licznik = 0;	
						}
					}
 
				function startInterwal() {
						interwal = setInterval(function(){aa12();}, ZMIANA);
					}
 
window.onload = startInterwal();
[JAVASCRIPT] pobierz, plaintext 

Oczywiscie dany kod nie dziala, ale moze ktos mnie pokieruje co zmienic... Z gory dzieki

[CuteOne]

każde odpalenie aa12 powinno zwiększyć licznik o 1. Gdy ten przekroczy wielkość tablicy wraca do 0

[bilskij]

[JAVASCRIPT] pobierz, plaintext 
    zdj = new Array("images/slideGallery/1.jpg",
    "images/slideGallery/2.jpg",
    "images/slideGallery/3.jpg");
    var licznik = 0;
    const SEK = 1000;
    const ZM = 5*SEC;
    interwal = 0;
 
    function aa12() {
    var url = document.getElementById("c2");
    if(licznik < zdj.length){
    url.style.background = zdj[licznik];
    }else{
    licznik = 0;
    }
    licznik++;
    }
 
    function startInterwal() {
    interwal = setInterval(function(){aa12();}, ZM);
    }
 
    window.onload = startInterwal();
[JAVASCRIPT] pobierz, plaintext 

Zmienilem tak ale nadal nie dziala

[CuteOne]

Ale co dokładnie nie działa? wywala błąd w konsoli błędów?

[bilskij]

W czym najlepiej sprawdzac bledy javyscript Opera nic nie podpowiada o bledzi js

Ten post edytował bilskij 31.08.2011, 22:33:23

[CuteOne]

1.

[JAVASCRIPT] pobierz, plaintext 
 function startInterwal() {
    setInterval("aa12()", ZM);
 } 
[JAVASCRIPT] pobierz, plaintext 

2. nie background tylko background-image

Ten post edytował CuteOne 31.08.2011, 23:07:02

[bilskij]

Pozmienialem. Teraz na konsoli bledow zauwayzlem ze wyskakuje

url is not defined
url.style.backgroundImage = zdj[licznik];

[JAVASCRIPT] pobierz, plaintext 
    zdj = new Array("images/slide-gallery/1.jpg", "images/slide-gallery/2.jpg", "images/slide-gallery/3.jpg");
    var licznik = 0;
    const SEK = 1000;
    const ZM = 5*SEK;
	var url = document.getElementById("c2");
 
    function aa12() {
    if(licznik < zdj.length){
    url.style.backgroundImage = zdj[licznik];
    }
	else{
    licznik = 0;
    }
    }
 
    function startInterwal() {
    setInterval(aa12(), ZM)
    }
 
    window.onload = startInterwal();
[JAVASCRIPT] pobierz, plaintext 

[Rid]

Niech Pan wklei:
var url = document.getElementById("c2");
zaraz na początku funkcji
function aa12()
albo niech zmieni nazwę zmiennej url na inną,bo nie wiem czy ta nazwa czasami nie jest zarezerwowana.

Ten post edytował Rid 1.09.2011, 19:46:37

[bilskij]

Zmienilem nazwe na "urla" i teraz zmienilo sie że urla is null

[Rid]

Id c2 to button,textbox??

[bilskij]

ID c2 to div.

Pozniej jego style:

[CSS] pobierz, plaintext 
#c2 {
	width: 377px;
	height: 258px;
	float: right;
	margin: 0 7px 0 0;
	padding: 0;
}
[CSS] pobierz, plaintext 

[Rid]

urla.style.background = zdj[licznik];
zamienić na:
urla.style.background = 'url("'+zdj[licznik]+'")' ;

[bilskij]

Nic nie daje bo i tak urla jest nadal pusty

[Rid]

Przekombinowałem trochę na pewno ma być tak:
urla.style.background = 'url('+zdj[licznik]+')' ;

W html ma pan prawidłow napisane:

[HTML] pobierz, plaintext 
<div id="c2"></div>
[HTML] pobierz, plaintext 

I jeszcze jeden błąd ,zmienną pan nie ma zadeklarowaną ,prawidłowo:

[HTML] pobierz, plaintext 
var zdj = new Array("images/slide-gallery/1.jpg", "images/slide-gallery/2.jpg", "images/slide-gallery/3.jpg");
[HTML] pobierz, plaintext 

Dużo błędów,ma pan niech pan przeanalizuje kod,jak się powinno stosować metody i funkcje.
Poprawić też należy:

[HTML] pobierz, plaintext 
function startInterwal() {
setInterval(aa12(), ZM)
}
[HTML] pobierz, plaintext 

na

[HTML] pobierz, plaintext 
function startInterwal() {
setInterval("aa12()", ZM);
}
[HTML] pobierz, plaintext 

Sugerowałbym ,także użycie firebuga i debugowanie.

Ten post edytował Rid 1.09.2011, 21:04:28

[bilskij]

c2 nadal jest puste. Zmienia sie to dopiero w momencie gdy wrzuce

var urla = document.getElementById("c2");

do

window.onload