Makee72
kuvaesitys
Kuvaesitys javascript
Tässä ohjeet miten saat alla olevan kuvaesityksen kotisivuillesi
Lataa ja pura tämä paketti.paketissa on slideshow niminen kansio
mikä pitää sisällään kuvaesitys.js javascripti tiedoston,sekä kuvasarjan alla olevat menu napit.
siirrä koko kansio kotisivuillesi
Lisää <head> tagien väliin tämä rivi.
<script type="text/javascript" src="slideshow/kuvaesitys.js"></script>
Kuvat mitkä haluat esitykseen siirrät tuonne slideshow kansioon.
Sit vaan lisäät alla olevan koodin <body> tagien väliin siihen kohtaan sivua missä haluat kuvaesityksen näkyvän.
<div id="imSSBackg_0" onmouseover="imSSDescrHide(0);" onmouseout="imSSDescrShow(0);">
<img id="imSSImage_0" src="slideshow/kuva1.jpg" onclick="imLink(0);" alt="" />
<div id="imSSDescr_0"></div>
</div>
</div>
<img src="slideshow/ss_left0.gif" alt="" /><img class="imssBtn" src="slideshow/ss_prev0.gif" onclick="imDoTrans(0,-1)" alt="Back" /><img class="imssBtn"
src="slideshow/ss_play0.gif" id="imssPlay_0" onclick="imSSPlay(0,0,0)" alt="Play" /><img class="imssBtn" src="slideshow/ss_next0.gif" onclick="imDoTrans(0,1)" alt="Next"
/><img src="slideshow/ss_right0.gif" alt="" />
<script type="text/javascript">
imSSLoad(0,[["kuva1.jpg",550,400,3,0,"","#"],["kuva2.jpg",550,400,3,0,"","#"],["kuva3.jpg",550,400,3,0,"","#"],["kuva4.jpg",550,400,3,0,"","#"],
["kuva5.jpg",550,400,3,0,"","#"]]);
imDoTrans(0,0);
</script>
Eli kohdassa "slideshow/kuva1.jpg" on polku missä kuvat sijaitsevat ja tässä tapauksessa kuvat ovat nimetty kuva1.jpg,kuva2.jpg jne. eli noihin punaisella merkittyihin laitat sit niitten omien kuviesi nimet.halutessasi voit lisätä tuohon väliin niin monta kuvaa kun haluat lisäämällä niitä tällä koodilla ["kuva6.jpg",550,400,3,0,"","#"] ,muista erottaa sulkeet pilkulla,viimeisen kuvan jälkeen tulee tuo ]);
Tällä samalla javascriptillä voit laittaa 1-6 kuvaesitystä samalle sivulle,silloin sun pitää vain lisätä <body> osaan tulevan koodin alkuun nollan(0) tilalle numerot yksi -viisi eli ensimmäisessä esityksessä on nuo nollat,toisessa ykköset jne.
eli ensimmäisessä näin:
<div id="imSSBackg_0" onmouseover="imSSDescrHide(0);" onmouseout="imSSDescrShow(0);">
<img id="imSSImage_0" src="slideshow/kuva1.jpg" onclick="imLink(0);" alt="" />
<div id="imSSDescr_0"></div>
Toisessa näin:
<div id="imSSBackg_1" onmouseover="imSSDescrHide(1);" onmouseout="imSSDescrShow(1);">
<img id="imSSImage_1" src="slideshow/kuva1.jpg" onclick="imLink(1);" alt="" />
<div id="imSSDescr_1"></div>
ja niin edelleen.
kuvaesitys näyttää kuvat sen kokoisina sivulla kuin kuvat ovat eli kuvat kannattaa muokata halutun kokoisiksi jollain kuvan käsittely ohjelmalla