macam macam kode scroll dan spoiler


macam macam kode scroll:
kode 1:
<div align="center"><table width="250" border="1"><tr> <th colspan="100%" scope="col">ARTIKEL LAINNYA</th> </tr><tr><td><div style="font-family: arial; font-size: 12px; overflow: scroll; width: 350px; height: 150px;"><div style="text-align: center; width: 100%; padding: 0 px; overflow: hidden;">taruhlah tulisa anda disini</div></div></td></tr></table></div>

kode 2:
<div style="overflow:auto;width:400px;height:200px;padding:10px;border:1px solid #333">ISI SCROLL BAR DI SINI</div>

kode 3
<span style="font-style: italic;"><span style="font-style: italic;"><div style="height: 150px; width: 400px; font: 16px/26px Georgia,Garamond,Serif; overflow: scroll;">Masukan Tulisan atau gambar di sini</div>
kode 4

<span style="font-style: italic;"><span style="font-style: italic;"><div style="height: 100px; width: 400px; font: 16px/26px Georgia,Garamond,Serif; overflow: scroll;">Masukan Tulisan atau gambar di sini</div>

macam macam kode spoiler
spoiler 1:
spoiler tampilkan/sembunyikan

<div><input value="Tampilkan" style="margin: 0px; padding:0px;width:auto;font-size:10px;" onclick="if(this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display != &#39;&#39;) { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;&#39;; this.innerText = &#39;&#39;; this.value = &#39;Sembunyikan&#39;; } else{ this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;none&#39;; this.innerText = &#39;&#39;; this.value = &#39;Tampilkan&#39;; }" type="button" /></div>
<div class="alt2">
<div style="display: none;">
<div style="background:#000000;text-align:left;padding:10px;color:#ffffff;">
Masukkan text-nya disini. Gambar juga bisa.</div></div></div>

spoiler 2
Spoiler SHOW/HIDE

<div><div style="margin: 20px; margin-top:5px"><div style="margin-bottom: 2px;" class="smallfont"><input style="margin: 0px; padding: 5px; width: auto; " value="Show" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != ''){ this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Hidden'; }else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }"type="button"/></div><div class="alt2"><div style="display: none;"><div style="border: none; color:none; background-color:none; text-align: justify; padding:10px;">
DISINI LETAK KONTENT ANDA</div></div></div></div></div>

spoiler 3
Spoiler OPEN / CLOSE

<div><div style="margin: 5px;"><div class="smallfont" style="margin-bottom: 2px;"><span style="font-weight: bold;">Judul Spoiler</span><input value="Open!!!" style=" margin:5px;padding: 0px; width: 80px; font-size: 10px;" onclick="if (this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display != &#39;&#39;) { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;&#39;; this.innerText = &#39;&#39;; this.value = &#39; Close..&#39;; } else { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;none&#39;; this.innerText = &#39;&#39;; this.value = &#39; Clik Here&#39;; }" type="button" />
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">
ISI SPOILER
</div></div></div>




Klik Untuk melihat
disini anda meletakkan artikel / gambar atau terserah anda.

meta tag untuk memaksimalkan postingan
membuat tulisan yang disembunyikan
cara membuat scroll
boz seo sekedar belajar dan berbagi