JavaScript

JavaScripti >> Slike >> Super prezentacija

Opis:
Lepo oblikovana preprosta skripta, ki vam omogoča, da se vaše slike prikazujejo v časovnem zaporedju, slike lčahko izebere tudi iz drop down menuja, lahko pa se po slikah premikate z gumbi naprej, nazaj...

Primer:

Slikovna prezentacija

Izvorna koda:
Korak 1 :
Ta del kode vstavite v <head> del strani:

<SCRIPT LANGUAGE="JavaScript"> var rotate_delay = 5000; // delay in milliseconds (5000 = 5 secs) current = 0; function next() { if (document.slideform.slide[current+1]) { document.images.show.src = document.slideform.slide[current+1].value; document.slideform.slide.selectedIndex = ++current; } else first(); } function previous() { if (current-1 >= 0) { document.images.show.src = document.slideform.slide[current-1].value; document.slideform.slide.selectedIndex = --current; } else last(); } function first() { current = 0; document.images.show.src = document.slideform.slide[0].value; document.slideform.slide.selectedIndex = 0; } function last() { current = document.slideform.slide.length-1; document.images.show.src = document.slideform.slide[current].value; document.slideform.slide.selectedIndex = current; } function ap(text) { document.slideform.slidebutton.value = (text == "Ustavi") ? "Začni" : "Ustavi"; rotate(); } function change() { current = document.slideform.slide.selectedIndex; document.images.show.src = document.slideform.slide[current].value; } function rotate() { if (document.slideform.slidebutton.value == "Stop") { current = (current == document.slideform.slide.length-1) ? 0 : current+1; document.images.show.src = document.slideform.slide[current].value; document.slideform.slide.selectedIndex = current; window.setTimeout("rotate()", rotate_delay); } } </script>

Korak 2:
Ta del kode vstavite v <body> del strani:

<center> <form name=slideform> <table cellspacing=1 cellpadding=4 bgcolor="#000000"> <tr> <td align=center bgcolor="white"> <b>Slikovna prezentacija</b> </td> </tr> <tr> <td align=center bgcolor="white" width=200 height=150> <img src="slika1.jpg" name="show"> </td> </tr> <tr> <td align=center bgcolor="#C0C0C0"> <select name="slide" onChange="change();"> <option value="slika1.jpg" selected>Slika 1 <option value="slika2.jpg">Slika 2 <option value="slika3.jpg">Slika 3 <option value="slika4.jpg">Slika 4 <option value="slika5.jpg">Slika 5 <option value="slika6.jpg">Slika 6 <option value="slika7.jpg">Slika 7 <option value="slika8.jpg">Slika 8 </select> </td> </tr> <tr> <td align=center bgcolor="#C0C0C0"> <input type=button onClick="first();" value="|<<" title="Začenjanje"> <input type=button onClick="previous();" value="<<" title="Prejšnja"> <input type=button name="slidebutton" onClick="ap(this.value);" value="Začni" title="Avtomatska prezentacija"> <input type=button onClick="next();" value=">>" title="Naslednja"> <input type=button onClick="last();" value=">>|" title="Konec"> </td> </tr> </table> </form> </center>