e-gradiva     HTML CSS JavaScript Načrtovanje    
  logotip  
SERŠ Maribor Iskanje Primeri

Slajd šou

Koda: 
<script type="text/javascript">
var fotke = new Array("slike/foto0.jpg","slike/foto1.jpg","slike/foto2.jpg",
"slike/foto3.jpg" , "slike/foto4.jpg","slike/foto5.jpg")
var xfotke = new Array("slike/xfoto0.jpg","slike/xfoto1.jpg","slike/xfoto2.jpg",
"slike/xfoto3.jpg" , "slike/xfoto4.jpg","slike/xfoto5.jpg")
var vfotke = new Array("slike/foto0.jpg","slike/foto1.jpg","slike/foto2.jpg",
"slike/foto3.jpg","slike/foto4.jpg","slike/foto5.jpg")
var napis= new Array("Ena fotka" , "\u0160e ena fotografija" , "A ni lepo?",
"To je na SER\u0160!!" , "\u0160e vedno slike!", "Heja")
var fotka = 0
//prikaze prejsnjo fotko
function nazaj()
{
    if (fotka == 0)
        {
	fotka=1
        }
    fotka--
    naredi(fotka)
}
//prikaze naslednjo fotko
function naprej()
{
    if (fotka == 5)
        {
        fotka=4
        }
    fotka++
    naredi(fotka)
}
//naredi to kar je potrbno
function naredi(a)
{
		fotka=a
    document.all.slika.src=fotke[fotka];
    besedilo.firstChild.nodeValue=napis[fotka]
}

function odprix(x)
{
okence = window.open('', 'fotke', 'menubar=0,toolbar=0,
location=0, directories=0, scrollbars=0,status=0, fullscreen=0,left=0,top=0')
okence.document.writeln('<!DOCTYPE htmlPUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"')
okence.document.writeln('"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">')
okence.document.writeln('<html lang="si"xml:lang="si" xmlns="http://www.w3.org/1999/xhtml">')
okence.document.writeln('<head>')
okence.document.writeln('<title>SERŠ Maribor</title>')
okence.document.writeln('<link rel="stylesheet" type="text/css" href="../../plasti.css" />')
okence.document.writeln('</head><body>')
okence.document.writeln('<p>')
okence.document.writeln('<img alt="slika" id="slika" src="' + vfotke[x] + '"onclick="window.close()">')
okence.document.writeln('</p>')
a=okence.document.images["slika"].width + 30
b=okence.document.images["slika"].height + 100
if (a>document.body.clientWidth-50)
{a=document.body.clientWidth-50; b=a*3/4;
okence.document.images["slika"].width=b}
okence.resizeTo(a,b)
okence.focus()
okence.document.writeln('<p style="color:white;text-align:center" onclick="window.close()">Zapri okno</p>')
okence.document.writeln('</body>')
}
</script>
<script type="text/javascript">
for (var i=0; i<6 ; i++)
{
document.write('<img alt="slika" src="' + xfotke[i] + '" ondblclick="odprix(' + i + ')" onclick="naredi(' + i + ')">')
}
</script>
<p>
<input type="button" onclick="naredi(0)" value="Začetek" />
<input type="button" onclick="nazaj()" value="Nazaj" />
<input type="button" onclick="naprej()" value="Naprej" />
<input type="button" onclick="naredi(5)" value="Konec" />
</p>
<p id="besedilo">To je nekaj....</p>
Izgled v
brskalniku:

Ogled v novem oknu

Razlaga: TO NI TO!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! Na začetku se določijo vse možne spremenljivke kot polja. Za tvorbo novega predmeta se uporabi ključna beseda New, sledi še navedba razreda Array in potem v oklepajih napisane vrednosti katere so ločene z vejicami in napisane v narekovajih. Funkcija nazaj() prikaže prejšnjo sliko medtem ko funkcija naprej() prikaže naslednjo sliko. Funkcija gor(fotka) prikaže sliko in ustavi animacijo. Funkcija start() zažene slideshow z intervalom napisanim v milisekundah, funkcija go() obrne slideshow v obratnem vrstnem redu, z istim intervalom, funkcija stop() pa ustavi slideshow. Funkcija odpri(x) pa odpre novo okno, z vsemi potrebnimi podatki, kjer se izvaja slideshow.

gor Gor     e-gradiva     JavaScript     Primeri

SERŠ Maribor : Strokovna gimnazija : 2004 : Davorin Lenart