{"id":233,"date":"2010-04-23T12:45:10","date_gmt":"2010-04-23T10:45:10","guid":{"rendered":"http:\/\/www.hongisto.info\/wp\/?p=233"},"modified":"2011-05-18T12:45:29","modified_gmt":"2011-05-18T10:45:29","slug":"javascriptilla-kuvan-vaihto","status":"publish","type":"post","link":"https:\/\/www.hongisto.info\/wp\/2010\/04\/javascriptilla-kuvan-vaihto\/","title":{"rendered":"Javascriptill\u00e4 kuvan vaihto"},"content":{"rendered":"<p>Luo kolme eri kuvaa ja nime\u00e4 ne kuva1.png, kuva2.png ja kuva3.png.<br \/>\nTallenna ne kuvat kansioon.<\/p>\n<p>Tee HTML sivu ja laita siihen vaikka taulukko, jonka sis\u00e4\u00e4n laitat ensimm\u00e4isen kuvasarjan kuvatiedoston. esim. kuva1.jpg.<br \/>\nLaita kuvan ID:ksi kuvatsr.<\/p>\n<p>Laita alla oleva koodi &lt;head&gt; &lt;\/head&gt; tagien v\u00e4liin<\/p>\n<table border=\"0\" cellspacing=\"5\" cellpadding=\"5\" width=\"750\" align=\"center\">\n<tbody>\n<tr>\n<td align=\"left\" valign=\"top\">&lt;script type=&#8221;text\/javascript&#8221;&gt;<br \/>\n\/\/ Luodaan kuvista taulukko<br \/>\nvar kuvat = new Array();<br \/>\nkuvat[0]=&#8221;kuvat\/kuva1.png&#8221;;<br \/>\nkuvat[1]=&#8221;kuvat\/kuva2.png&#8221;;<br \/>\nkuvat[2]=&#8221;kuvat\/kuva3.png&#8221;;<br \/>\nvar kuvatmaara = 0, kuvatloppu = 2-0;\/\/Funktio, jolla vaihdetaan kuvia painikkeiden avulla<br \/>\nfunction vaihdakuvat(sr) {<br \/>\nif (kuvatmaara+sr &gt;= 0 &amp;&amp; kuvatmaara+sr &lt;= kuvatloppu) kuvatmaara += sr;<br \/>\ndocument.getElementById(&#8220;kuvatsr&#8221;).src=kuvat[kuvatmaara];<br \/>\n}<br \/>\n&lt;\/script&gt;<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<p>Seuraavaksi luo linkit jotka kuvaavat &#8220;Edellinen&#8221; ja &#8220;Seuraava&#8221;.<\/p>\n<p>Laita &#8220;edellinen&#8221; linkin osoitteeksi seuraava rivi:<\/p>\n<table border=\"0\" cellspacing=\"5\" cellpadding=\"5\" width=\"750\" align=\"center\">\n<tbody>\n<tr>\n<td align=\"left\" valign=\"top\">javascript:vaihdakuvat(-1)<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<p>Laita &#8220;seuraava&#8221; linkin osoitteeksi seuraava rivi:<\/p>\n<table border=\"0\" cellspacing=\"5\" cellpadding=\"5\" width=\"750\" align=\"center\">\n<tbody>\n<tr>\n<td align=\"left\" valign=\"top\">javascript:vaihdakuvat(+1)<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<p>Tallenna lopuksi HTML sivu.<br \/>\nNyt voit testata ohjeen mukaisesti tehty\u00e4 HTML sivua.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Luo kolme eri kuvaa ja nime\u00e4 ne kuva1.png, kuva2.png ja kuva3.png. Tallenna ne kuvat kansioon. Tee HTML sivu ja laita siihen vaikka taulukko, jonka sis\u00e4\u00e4n laitat ensimm\u00e4isen kuvasarjan kuvatiedoston. esim. kuva1.jpg. Laita kuvan ID:ksi kuvatsr.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"ngg_post_thumbnail":0,"footnotes":""},"categories":[16],"tags":[],"yst_prominent_words":[],"_links":{"self":[{"href":"https:\/\/www.hongisto.info\/wp\/wp-json\/wp\/v2\/posts\/233"}],"collection":[{"href":"https:\/\/www.hongisto.info\/wp\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hongisto.info\/wp\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hongisto.info\/wp\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hongisto.info\/wp\/wp-json\/wp\/v2\/comments?post=233"}],"version-history":[{"count":3,"href":"https:\/\/www.hongisto.info\/wp\/wp-json\/wp\/v2\/posts\/233\/revisions"}],"predecessor-version":[{"id":236,"href":"https:\/\/www.hongisto.info\/wp\/wp-json\/wp\/v2\/posts\/233\/revisions\/236"}],"wp:attachment":[{"href":"https:\/\/www.hongisto.info\/wp\/wp-json\/wp\/v2\/media?parent=233"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongisto.info\/wp\/wp-json\/wp\/v2\/categories?post=233"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongisto.info\/wp\/wp-json\/wp\/v2\/tags?post=233"},{"taxonomy":"yst_prominent_words","embeddable":true,"href":"https:\/\/www.hongisto.info\/wp\/wp-json\/wp\/v2\/yst_prominent_words?post=233"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}