Forum Index

Rules  | Points  | Add...  | Recent posts  | Search | Register | Log in



Automatycznie zmieniające się zdjecia na stronie internetowe


  Main Page -> Forum Index -> Programming Generally -> Beginners Programming ->Automatycznie zmieniające się zdjecia na stronie internetowe Post new topic  Reply to topic 
Author
Hide the left column
Show left column Message
malum
Level 23
Location: Bydgoszcz
Joined: 20 Mar 2005
Posts: 763
Helped: 1
Post rating: 15
malum
Level 23
Post#1 10 Jan 2010 12:21  Topic author   

Automatycznie zmieniające się zdjecia na stronie internetowe


Witam!
Podczas tworzenia strony internetowej natrafiłem na problem.
Założenie jest takie, aby po otwarciu strony, znajdujące się na niej zdjęcia zmieniały się automatycznie co 3 sekundy.
Znalazłem taki skrypt:

Code:

<html>
<head>
<script type="text/javascript">
   var imgs = new Array('1.jpg', '2.jpg', '3.jpg', '4.jpg', '5.jpg');
   var pos  = 0;

   function chImg()
   {
      var i = document.getElementById( 'imgField' );

      i.src = '../fotki/kat3/' + imgs[ pos++ ];

      if( pos >= 5 )
      {
         pos = 0;
      }

      window.setTimeout( 'chImg()', 3000 );
   }
</script>
</head>
<body onload="chImg();">
<img src="../fotki/kat3/1.jpg" id="imgField"/>
</body>
</html>]


Działa bardzo dobrze, ale pozwala na wyświetlenie tylko jednego zdjęcia. Gdyby na stronie było ich 20 musiałbym 20 razy wklepywać ten sam skrypt z drobnymi zmianami, co w moim przypadku jest niepraktyczne, bo ilość zdjęć na stronie będzie zmieniała się praktycznie przy każdym odświeżeniu strony.

Próbowałem też zastosować program napisany w PHP połączony z autoodświeżaniem strony, ale przez to odświeżanie sypie mi się reszta strony.

Macie może jakiś lepszy skrypt?

No i drugie pytanie. Powyższy skrypt korzysta z nazw plików zapisanych do tablicy.
Jak stworzyć taką tablicę automatycznie bo w PHP robi się to tak:
Code:

<?
$folder = opendir('../fotki/kat3');
$i = 0;
while(false !=($plik = readdir($folder))){
if($plik != "." && $plik != ".."){
   $obrazki[$i]= $plik;
   $i++;
   }
}
closedir($folder);

$losowy=rand(0,count($obrazki)-1);

echo($losowy);
echo('<img src=../fotki/kat3/'.$obrazki[$losowy].'>');
?>

Powyższy programik również pozwala na automatyczną zmianę zdjęć, ale przy każdym odświeżeniu strony. Tu problemem jest znowu to odświeżanie - zdjęcia mają zmieniać się automatycznie.

Helpful post? + 0
Back to top

Google Adsense
Google


Back to top
DriverMSG
Admin grupy komputery
Location: Prowincja Liege
Joined: 28 Feb 2005
Posts: 34611
Helped: 2854
Post rating: 584
DriverMSG
Admin grupy komputery
Post#2 11 Jan 2010 04:08    

Re: Automatycznie zmieniające się zdjecia na stronie interne


Nie znam się na robieniu stron www, ale ostatnio pomagałem bratu w tworzeniu galerii, może przyda ci się to, co mi się zachowało - można tam regulować czas wyświetlania każdej fotki osobno.

Attachments:

Helpful post? + 0
Back to top
malum
Level 23
Location: Bydgoszcz
Joined: 20 Mar 2005
Posts: 763
Helped: 1
Post rating: 15
malum
Level 23
Post#3 11 Jan 2010 18:32  Topic author   

Re: Automatycznie zmieniające się zdjecia na stronie interne


DriverMSG wrote:
Nie znam się na robieniu stron www, ale ostatnio pomagałem bratu w tworzeniu galerii, może przyda ci się to, co mi się zachowało - można tam regulować czas wyświetlania każdej fotki osobno.


Dzięki wielkie za zainteresowanie, ale nie o to m chodzi.
Mam kika różnych skryptów realizujących zadanie automatycznego przechodzenia ze zdjęcia w zdjęcie, ale ani jeden nie daje się zastosować na jednej stronie dla kilku grup różnych zdjęć :-(

Ma ktoś jakiś pomysł na realizację tego zadania?

Helpful post? + 0
Back to top

Google Adsense
Google


Back to top
arnoldziq
Moderator Programowanie
Location: High Wycombe
Joined: 14 Apr 2006
Posts: 5130
Helped: 728
Post rating: 69
arnoldziq
Moderator Programowanie
Post#4 12 Jan 2010 11:21    

Re: Automatycznie zmieniające się zdjecia na stronie interne


Czemu nie coś takiego ?
Code:
<html>
<head>
<script type="text/javascript">
   var imgs   = new Array('1.jpg', '2.jpg', '3.jpg', '4.jpg', '5.jpg');
   var imgs2 = new Array('1.jpg', '2.jpg', '3.jpg', '4.jpg', '5.jpg');
   var pos  = 0;

   function chImg()
   {
      var i = document.getElementById( 'imgField' );
      var i2 = document.getElementById( 'imgField2' );
      i.src = '../fotki/kat3/' + imgs[ pos++ ];
      i2.src = '../fotki/kat4/' + imgs2[ pos++ ];

      if( pos >= 5 )
      {
         pos = 0;
      }

      window.setTimeout( 'chImg()', 3000 );
   }
</script>
</head>
<body onload="chImg();">
<img src="../fotki/kat3/1.jpg" id="imgField"/>
<br>
<img src="../fotki/kat4/1.jpg" id="imgField2"/>
</body>
</html>]


Helpful post? + 0
Back to top

Google Adsense
Google


Back to top
BRASS
Level 15
Joined: 02 Apr 2005
Posts: 193
Helped: 9
BRASS
Level 15
Post#5 19 Feb 2010 09:08    

Re: Automatycznie zmieniające się zdjecia na stronie interne


Zamiast setTimeout daj setInterval. setTimeout wywołuje sie tylko raz. setInterval działa stale aż do momentu kiedy nie dasz CrearInterval(wartosc_ zwrócona_przez setInternal)

Helpful post? + 0
Back to top
BooM-Bel
Level 1
Location: Galway
Joined: 05 Aug 2010
Posts: 1
BooM-Bel
Level 1
Post#6 05 Aug 2010 14:15    

Re: Automatycznie zmieniające się zdjecia na stronie interne


Wypróbowałem obie funkcje: "setInterval" i "setTimeout". "setTimeout" działa idealnie i obrazki zmieniają się cały czas bez względu na to jak długo otwarta jest strona. Niestety "setInterval" po kilku pętlach zaczyna zmieniać obrazki tak szybko że migają jak strobo na imprezie techno. W tym skrypcie lepszym rozwiązaniem jest "setTimeout".

Helpful post? + 0
Back to top
FoczkaMK
Level 7
Joined: 15 Jan 2012
Posts: 6
FoczkaMK
Level 7
Post#7 15 Jan 2012 23:37    

Re: Automatycznie zmieniające się zdjecia na stronie internetowe


Witam,
Próbowałam wykorzystać zaprezentowany wyżej przez arnoldziq skrypt ale niestety bez powodzenia.
Dla jednego zdjęcia (miejsca wyświetlania) działa ok.
Dla dwóch wyświetla co drugi obrazek:
dla zdjęcia1 - fotki 1,3,5
dla zdjęcia2 - fotki 2,4,puste miejce
Dla trzech wyświetla się co trzeci:
dla zdjęcia1 - fotki 1,4
dla zdjęcia2 - fotki 2,5
dla zdjęcia3 - fotki 3, puste miejce
Kombinowałam przez kilka godzin począwszy od zmian nazw plików jpg (pierwotnie były nazwy alfanumeryczne) i ich położenia w katalogach (pierwotnie w jednym) ale nie umiem znaleźć przyczyny. Docelowo chciałam ustawić 4 zdjęcia po 3 lub 5 zmian każde.

Kod dla 3 zdjęć:
Code:
<head>
<script type="text/javascript">
   var imgs = new Array('1.jpg', '2.jpg', '3.jpg', '4.jpg', '5.jpg');
   var imgs2 = new Array('1.jpg', '2.jpg', '3.jpg', '4.jpg', '5.jpg');
   var imgs3 = new Array('1.jpg', '2.jpg', '3.jpg', '4.jpg', '5.jpg');
   var pos  = 0;

   function chImg()
   {
      var i = document.getElementById( 'imgField' );
      var i2 = document.getElementById( 'imgField2' );
      var i3 = document.getElementById( 'imgField3' );
      i.src = 'images/my/my1/' + imgs[ pos++ ];
      i2.src = 'images/my/my2/' + imgs2[ pos++ ];
      i3.src = 'images/my/my3/' + imgs3[ pos++ ];

      if( pos >= 5 )
      {
         pos = 0;
      }

      window.setTimeout( 'chImg()', 3000 );
   }
</script>
</head>

<body topmargin="0" leftmargin="0" bgcolor="#99CCFF" onload="chImg();">

<img src="images/my/my1/1.jpg" id="imgField"/>
<img src="images/my/my2/1.jpg" id="imgField2"/>
<img src="images/my/my3/1.jpg" id="imgField3"/>

Poniżej podkreślone pliki, które sie wyświetlają, pozostałe nawet nie próbują mogę sobie wpisać nazwę nieistniejącego pliku i nie ma to żadnego wpływu na wykonywanie skryptu:
('1.jpg', '2.jpg', '3.jpg', '4.jpg', '5.jpg');
('1.jpg', '2.jpg', '3.jpg', '4.jpg', '5.jpg');
('1.jpg', '2.jpg', '3.jpg', '4.jpg', '5.jpg'); nic


działanie skryptu podejrzeć można po adresami:
1 zdjęcie: www.kulesza.net.pl/top1.htm
2 dzjecia: www.kulesza.net.pl/top2.htm
3 zdjęcia: www.kulesza.net.pl/top3.htm

Może ktoś podpowie co jest nie tak.

Helpful post? + 0
Back to top
arnoldziq
Moderator Programowanie
Location: High Wycombe
Joined: 14 Apr 2006
Posts: 5130
Helped: 728
Post rating: 69
arnoldziq
Moderator Programowanie
Post#8 16 Jan 2012 12:03    

Re: Automatycznie zmieniające się zdjecia na stronie internetowe


Sprawa jest dość prosta i chodzi o tzw. czeski błąd :)
Oryginalny skrypt, był przewidziany do zmiany tylko jednego obrazka, i jako taki działa bez problemów :)
Zauważ, że pozycja w tabeli pos jest zwiększana w trakcie wywołania.
Przy pierwszej pętli, pierwszy element jest zwiększany z 0 do 1 (pos++), ale chwilę potem ten sam element jest zwiększany z 1 do 2 itd.
Przy 3 obrazkach, przy drugiej pętli, która powinna wywołać drugi obrazek z tabeli, pierwsza tabela wskazuje na 4, druga na 5 a trzecia ... na 6. Stąd brak wyświetlania...
Żeby to naprawić, zmodyfilowałem skrypt w ten sposób :


Code: javascript
You must be logged in to see the content.


A wynik działania, możesz zobaczyć tutaj : Link

Helpful post? + 0
Back to top
FoczkaMK
Level 7
Joined: 15 Jan 2012
Posts: 6
FoczkaMK
Level 7
Post#9 16 Jan 2012 17:54    

Re: Automatycznie zmieniające się zdjecia na stronie internetowe


Wielkie dzięki.
Widzę, że za szybko się poddałam, bo chodziła mi po głowie zmiana 'pos' ale nie wiedziałam jak to ugryźć.
Jeszcze raz dziękuję.

Helpful post? + 0
Back to top
sebaq1
Level 1
Joined: 25 Jan 2012
Posts: 1
sebaq1
Level 1
Post#10 25 Jan 2012 16:39    

Re: Automatycznie zmieniające się zdjecia na stronie internetowe


Jest jakiś kod w HTML - u było by mi łatwiej go edytować???

Helpful post? + 0
Back to top
arnoldziq
Moderator Programowanie
Location: High Wycombe
Joined: 14 Apr 2006
Posts: 5130
Helped: 728
Post rating: 69
arnoldziq
Moderator Programowanie
Post#11 25 Jan 2012 17:50    

Re: Automatycznie zmieniające się zdjecia na stronie internetowe


sebaq1 wrote:
Jest jakiś kod w HTML - u było by mi łatwiej go edytować???

Dwa posty wyżej masz link do strony. Pobierz HTML i możesz sobie edytować do woli.

Helpful post? + 0
Back to top

Google Adsense
Google


Back to top
muli9
Level 9
Joined: 12 Aug 2008
Posts: 13
Post rating: 3
muli9
Level 9
Post#12 21 Feb 2012 14:41    

Re: Automatycznie zmieniające się zdjecia na stronie internetowe


Witam

Wkleiłem kod na stronie ale nie działa żaden z powyższych, wogóle nic się nie wyświetla w miejscu, w którym wstawiłem - co jest nie tak ?
W zasadzie to mnie interesuje zmiana tylko 2 obrazków, w jednym miejscu.

Helpful post? + 0
Back to top
arnoldziq
Moderator Programowanie
Location: High Wycombe
Joined: 14 Apr 2006
Posts: 5130
Helped: 728
Post rating: 69
arnoldziq
Moderator Programowanie
Post#13 21 Feb 2012 14:45    

Re: Automatycznie zmieniające się zdjecia na stronie internetowe


muli9 wrote:
Witam

Wkleiłem kod na stronie ale nie działa żaden z powyższych, wogóle nic się nie wyświetla w miejscu, w którym wstawiłem - co jest nie tak ?
W zasadzie to mnie interesuje zmiana tylko 2 obrazków, w jednym miejscu.

Masz gdzieś tę stronę umieszczoną ? Można to gdzieś zobaczyć ?
Jak nie, to zamieść tu kod, wraz z Twoimi obrazkami, które maja się zmieniać.

Helpful post? + 0
Back to top
muli9
Level 9
Joined: 12 Aug 2008
Posts: 13
Post rating: 3
muli9
Level 9
Post#14 21 Feb 2012 15:05    

Re: Automatycznie zmieniające się zdjecia na stronie internetowe


Narazie testuję na serwerze wirtualnym wamp - strona jest jako php. Gdziekolwiek bym nie wrzucil tego kodu nic sie nie dzieje i nic nie wyskakuje. Zdjęcia mam w folderze images, nazwy fotek to img2.jpg i img2a.jpg. A kod przerzuciłem dokładnie w tej postaci co jest powyżej i zamieniłem foto1.jpg na img2.jpg itp oraz katalog 'images/my1/' na 'images/'

Helpful post? + 0
Back to top
arnoldziq
Moderator Programowanie
Location: High Wycombe
Joined: 14 Apr 2006
Posts: 5130
Helped: 728
Post rating: 69
arnoldziq
Moderator Programowanie
Post#15 21 Feb 2012 15:19    

Re: Automatycznie zmieniające się zdjecia na stronie internetowe


Twój opis niczego nie zmienia, wystarczy, że zmieniłeś gdzieś jedną literę i skrypt się nie wykona.
Dlatego bez kodów źródłowych, nie ruszymy z miejsca. :/

Helpful post? + 0
Back to top
muli9
Level 9
Joined: 12 Aug 2008
Posts: 13
Post rating: 3
muli9
Level 9
Post#16 21 Feb 2012 16:44    

Re: Automatycznie zmieniające się zdjecia na stronie internetowe


Cos takiego mam





Code: php
You must be logged in to see the content.




Co ciekawe dziś znalazłem coś takiego i już się coś pokazuje ale nie jest to obrazek tylko jakby go nie wczytało:




Code: php
You must be logged in to see the content.


Proszę pamiętać o używaniu znaczników syntax. Opcja Listing kodu. - arnoldziq

Helpful post? + 0
Back to top
arnoldziq
Moderator Programowanie
Location: High Wycombe
Joined: 14 Apr 2006
Posts: 5130
Helped: 728
Post rating: 69
arnoldziq
Moderator Programowanie
Post#17 21 Feb 2012 16:55    

Re: Automatycznie zmieniające się zdjecia na stronie internetowe


Górny (mój) skrypt się nie wykona, bo nie ma gdzie wyświetlać obrazków...
Skrypt oswołuje się do konkretnych miejść na stronie, oznaczonych imgField1, imgField2 itd.
U Ciebie ich po prostu nie ma.
Nie wystarczy sobie "wkleić" czegoś do swojego kodu, żeby od razu zadziałało...

Helpful post? + 0
Back to top
muli9
Level 9
Joined: 12 Aug 2008
Posts: 13
Post rating: 3
muli9
Level 9
Post#18 21 Feb 2012 17:11    

Re: Automatycznie zmieniające się zdjecia na stronie internetowe


Oczywiście masz racje - głupota z mojej strony - teraz już coś ruszyło - widać jeden obrazek tylko się nie zmienia ;)

Helpful post? + 0
Back to top
arnoldziq
Moderator Programowanie
Location: High Wycombe
Joined: 14 Apr 2006
Posts: 5130
Helped: 728
Post rating: 69
arnoldziq
Moderator Programowanie
Post#19 21 Feb 2012 17:16    

Re: Automatycznie zmieniające się zdjecia na stronie internetowe


Drugi skrypt można uruchomić w ten sposób :


Code: html4strict
You must be logged in to see the content.


Helpful post? + 0
Back to top
muli9
Level 9
Joined: 12 Aug 2008
Posts: 13
Post rating: 3
muli9
Level 9
Post#20 21 Feb 2012 17:34    

Re: Automatycznie zmieniające się zdjecia na stronie internetowe


Niestety w żadnym z kodów nie chce się zmieniać - jest tylko statyczny obraz

a co powinno być po src może tu jest problem <img src="" id="pic1" /> ?

Dodano po 8 [minuty]:

ok ruszyło dzięki wielkie ;)

Helpful post? + 0
Back to top
arnoldziq
Moderator Programowanie
Location: High Wycombe
Joined: 14 Apr 2006
Posts: 5130
Helped: 728
Post rating: 69
arnoldziq
Moderator Programowanie
Post#21 21 Feb 2012 17:35    

Re: Automatycznie zmieniające się zdjecia na stronie internetowe


muli9 wrote:
Niestety w żadnym z kodów nie chce się zmieniać - jest tylko statyczny obraz

Cos przechwytuje twój timer.
muli9 wrote:
a co powinno być po src może tu jest problem <img src="" id="pic1" /> ?

Tam może być cokolwiek, to po prostu miejsce, w którym będą wymieniane linki do obrazków. Możesz jako "scr" podać link do istniejącego obrazka i od tego obrazka wszystko będzie "startować".

Helpful post? + 0
Back to top

Google Adsense
Google


Back to top
muli9
Level 9
Joined: 12 Aug 2008
Posts: 13
Post rating: 3
muli9
Level 9
Post#22 21 Feb 2012 17:42    

Re: Automatycznie zmieniające się zdjecia na stronie internetowe


Już super śmiga - miałem w body <body onload="chImg();"> z poprzedniego skryptu i to zakłócało nowy skrypt - jeszcze raz dzięki.

Helpful post? + 0
Back to top
adziozone2
Level 8
Location: Kraków
Joined: 11 Dec 2008
Posts: 60
adziozone2
Level 8
Post#23 15 Oct 2013 11:13    

Re: Automatycznie zmieniające się zdjecia na stronie internetowe


arnoldziq wrote:
Drugi skrypt można uruchomić w ten sposób :


Code: html4strict
You must be logged in to see the content.


Hej,

Wszystko jest tak jak trzeba, tylko jak ktoś chcę umieścić kod w osobnym pliku np. [i]"nz.js"
a zostawić na stronce tylko "<img scr="" id="pic1"/>" to raczej chyba ze się myle powinno być inaczej. A sam nie wiem, co to ma być, wiem ze na stronce na się znajdować:

<script typy="text/javascript" src="zm.js"></script>

<img scr="" id="pic1" />


ale to nie działa, i dlatego pytam was.

Helpful post? + 0
Back to top
arnoldziq
Moderator Programowanie
Location: High Wycombe
Joined: 14 Apr 2006
Posts: 5130
Helped: 728
Post rating: 69
arnoldziq
Moderator Programowanie
Post#24 15 Oct 2013 11:28    

Re: Automatycznie zmieniające się zdjecia na stronie internetowe


Może chodzi o użycie nieznanego (z poziomu HTML/javaScript) słowa typy, zamiast type ?

Helpful post? + 0
Back to top
Mr_Unk
Level 16
Location: Radom
Joined: 24 Jan 2013
Posts: 174
Helped: 19
Post rating: 3
Mr_Unk
Level 16
Post#25 15 Oct 2013 11:29    

Re: Automatycznie zmieniające się zdjecia na stronie internetowe


Tylko po co tak rzeźbić - nie możesz po prostu użyć dowolnego slidera ?

Choćby tego

Po co pisać coś, co ktoś inny napisał już dawno temu... lepiej.

Helpful post? + 0
Back to top
adziozone2
Level 8
Location: Kraków
Joined: 11 Dec 2008
Posts: 60
adziozone2
Level 8
Post#26 15 Oct 2013 12:31    

Re: Automatycznie zmieniające się zdjecia na stronie internetowe


ok, wszystko jasne,

Helpful post? + 0
Back to top
Post new topic  Reply to topic     Main Page -> Forum Index -> Programming Generally -> Beginners Programming -> Automatycznie zmieniające się zdjecia na stronie internetowe
Page 1 of 1

Similar topics to automatycznie zmieniające się zdjecia na stronie internetowe

zmieniające sie zdjecie na stronie www (5)
[vb.net/t-sql] - Jak przedstawić graficznie zdarzenia zmieniające się w czasie (1)
Brama po opusczeniu automatycznie się podnosi (2)
I2C w Atmega 168. Czy uruchamia się automatycznie? (3)
Czy da się automatycznie policzyć ilość cykli zegara? (7)
Brama Hormann - nie zamyka się automatycznie po zadz. czujki (9)
PC Schematic Schemat nie miesci się na stronie (8)
Java Script - Automatyczne zmienianie się zdjęć na stronie (4)


Switch to mobile version Switch to version for desktops

Administrator || Moderators || Forum Rules || General Rules || Cookies information || Editors || Contact for companies || Contact

Page generation time: 0.087 seconds