Showing posts with label Berbagi Ilmu. Show all posts
Showing posts with label Berbagi Ilmu. Show all posts

Font Batak Terbaru

Dengan semakin berkembangnya jaman, peninggalan-peninggalan para leluhur (nenek moyang) justru semakin terlupakan. Salah satu diantaranya adalah Aksara Batak Toba.
Dalam suku Batak Toba pada jaman dahulu, aksara Batak digunakan untuk menyampaikan segala sesuatu dalam bentuk tulisan.

Pada topik ini, saya menyediakan Font Batak Toba Terbaru untuk anda yang membutuhkan. Font ini belum tersedia di situs website yang lain. Jadi, saya akan menjelaskan sedikit cara penggunaan Font Batak Terbaru ini.

Font Batak Toba terdiri dari dua bagian, yaitu: Ina Ni Surat dan Anak Ni Surat.

Yang termasuk dalam Ina Ni Surat adalah:

A, Ha, Na, Ra, Ta,
Ba, Wa, I, Ma, Nga, La, Pa,
Sa, Da, Ga, Ja,
Ya, U, Ka, Kha, Ca, Nda, Mba, Fa, Qa, Za, Nya.

Yang ditandai dengan warna biru adalah aksara utama. Dan yang ditandai dengan warna merah adalah sebagai tambahan (pelengkap).
Berarti Ina Ni Surat terdiri dari 19 aksara utama ditambah dengan 8 aksara pelengkap, dan totalnya = 27 aksara.

Font ini sebenarnya sama dengan font Batak Toba yang lain, namun ada perbedaannya seperti aksara "Ka". Pada font ini, aksara (Ka) sudah menggunakan tanda (=) di atasnya, dan tidak sama lagi dengan aksara (Ha).
Untuk lebih jelas, silahkan lihat gambar berikut:


Yang termasuk dalam Anak Ni Surat adalah:

Huruf e dengan tanda (-) → Hatadingan.
Huruf i dengan tanda (o) → Singkora.
Huruf o dengan tanda (×) → Haluaon.
Huruf u dengan tanda (>) → Haborotan.
Huruf ng dengan tanda (-) → Paminggil.
Tanda (\) → Pangolat.

>> Tanda Singkora dan tanda Haluaon diletakkan di sebelah kanan Ina Ni Surat.

>> Tanda Hatadingan diletakkan di atas sebelah kiri Ina Ni Surat.

>> Tanda Paminggil diletakkan di atas sebelah kanan Ina Ni Surat, atau di atas tanda Singkora dan tanda Haluaon (jika huruf a pada Ina Ni Surat di ganti dengan huruf i atau o).

>> Tanda Haborotan diletakkan di bawah tengah atau di bawah sebelah kanan Ina Ni Surat.

>> Tanda Pangolat diletakkan di sebelah kanan Ina Ni Surat. Tanda ini dipakai jika Ina Ni Surat tidak menggunakan huruf a, dan juga tidak menggunakan Anak Ni Surat yang lain.

Cara penulisan Ina Ni Surat pada font ini adalah:

A = Huruf a
Ha = Huruf h
Na = Huruf n
Ra = Huruf r
Ta = Huruf t
Ba = Huruf b
Wa = Huruf w
I = Huruf I
Ma = Huruf m
Nga = Tanda <
La = Huruf l
Pa = Huruf p
Sa = Huruf s
Da = Huruf d
Ga = Huruf g
Ja = Huruf j
Ya = Huruf y
U = Huruf U
Ka = Huruf k
Kha = Tanda ¥
Ca = Huruf c
Nda = Tanda [
Mba = £
Fa = Huruf f
Qa = Huruf q
Za = Huruf z
Nya = Tanda {

Cara penulisan Anak Ni Surat pada font ini adalah:

e = Huruf e
i = Huruf i
o = Huruf o
u = Huruf u
ng = Tanda ^
Pangolat = \

File Font Batak Terbaru
Server 1:  DOWNLOAD
Server 2:  DOWNLOAD

Itulah Font Batak Toba Terbaru dan cara penggunaanya, semoga bermanfaat.
Jika ada yang perlu ditanyakan tentang font ini, silahkan berkomentar dengan baik dan sopan.

Daftar Kode Warna Hijau

Warna hijau pada dasarnya memiliki warna yang sangat beragam. Warna hijau merupakan warna sekunder hasil penggabungan antara warna kuning dan warna biru, dan tersusun dari campuran antara warna kuning biru dan warna magenta sebagai pelengkap.

Ragam variasi warna ini juga bisa didapatkan dari hasil penggabungan dengan warna lain sehingga menghasilkan berbagai ragam variasi warna hijau.

Warna hijau memiliki banyak arti seperti sebagai simbol alam, simbol kesejukan, simbol kesehatan, dan masih banyak lagi. Hijau sering digambarkan sebagai ketabahan dalam menjalani penderitaan, keinginan yang kuat, dan gambaran kekerasan hati.

Sedangkan secara alami, warna hijau merupakan simbol kesuburan. Pemandangan yang hijau dapat meredam stres pada seseorang, memberikan rasa aman, dan merasa terlindungi.

Seseorang yang menyukai corak warna hijau memiliki sifat yang romantis, pecinta keindahan, dan menyukai suasana alami. Dalam keadaan yang penting, seseorang penyuka warna hijau akan berubah menjadi seorang yang berwatak keras dan ucapannya terkadang sangat kasar.

Warna hijau bisa membangkitkan rasa kebahagiaan, rasa gembira, dan gairah hidup. Selain itu, warna hijau bisa diaplikasikan dengan berbagai corak misalnya warna rumah, gedung, pentunjuk jalan, pakaian, dan lain sebagainya.

Berikut adalah jenis-jenis warna hijau beserta kodenya.

  Daftar Kode Warna Hijau
KODE WARNA JENIS WARNA
#adff2f
#7fff00
#7cfc00
#00ff00
#32cd32
#98fb98
#90ee90
#00fa9a
#00ff7f
#3cb371
#2e8b57
#228b22
#008000
#006400
#9acd32
#6b8e23
#808000
#556b2f
#66cdaa
#8fbc8f
#20b2aa
#008b8b
#008080


Baca Juga : Daftar Kode Warna Ungu Dan Merah Muda

Itulah Daftar Kode Warna Hijau, dan semoga bermanfaat.

Daftar Kode Warna Kuning Dan Orange

Warna kuning merupakan warna primer perpaduan antara warna magenta dan warna cyan. Dan warna kuning adalah warna cerah, yang biasa dilambangkan perdamaian dan keceriaan.

Dari segi psikologi, keberadaan warna kuning dapat merangsang aktivitas pikiran dan mental. Warna kuning sangat baik digunakan untuk membantu penalaran secara logis, sehingga pecinta warna kuning cenderung lebih bijaksana dan cerdas.

Warna kuning adalah warna terbaik untuk menciptakan semangat hidup dan dapat membangkitkan kepercayaan diri. Dalam psikologi warna, warna ini dapat memberikan rasa kebahagiaan, kesenangan, dan menawarkan harapan.

Warna kuning juga bisa jadi kegelisahan karena terlalu cepat bergerak dan mengambil keputusan sehingga merasa gelisah. Kuning tidaklah emosional, karena itu tergantung pada diri sendiri.

Berikut adalah jenis-jenis warna kuning beserta kodenya.

Daftar Kode Warna Kuning
KODE WARNA JENIS WARNA
#ffffe0
#fffacd
#fafad2
#ffefd5
#ffe4b5
#ffdab9
#eee8aa
#f0e68c
#bdb76b
#ffd700
#ffff00

Warna orange merupakan perpaduan antara warna merah dan warna kuning, dan dapat memberi kesan hangat dan bersemangat.

Nuansa orange dapat mencakup berbagai emosi, namun emosi yang paling mencerminkan adalah keberanian. Warna ini sangat mudah digunakan untuk permainan kontras warna misalnya jika warna orange dipadukan dengan warna gelap seperti warna biru atau warna ungu, akan memberi efek yang sangat menarik.

Warna orange merupakan simbol dari petualangan, optimisme, percaya diri dan kemampuan dalam bersosialisasi. Warna orange juga dapat memberi kesan murah digunakan terlalu dominan. Warna yang cocok jika dipasangkan dengan warna orange adalah warna ungu atau warna biru.

Berikut adalah jenis-jenis warna orange beserta kodenya.

Daftar Kode Warna Orange
KODE WARNA JENIS WARNA
#ffa07a
#ff7f50
#ff6347
#ff4500
#ffa500
#ff8c00


Baca Juga : Daftar Kode Warna Merah

Itulah Daftar Kode Warna Kuning Dan Orange, dan semoga bermanfaat.

Daftar Kode Warna Ungu Dan Merah Muda

Warna ungu merupakan perpaduan antara warna violet dan warna magenta. Warna ungu jarang ditemukan secara alami dan sering dikatakan sebagai warna misterius, spritual, dan penuh imajinasi.

Secara psikologi, warna ungu sering dilambangkan dengan kemakmuran. Warna ungu dapat membawa seseorang terhadap berbagai perasaan yang berbeda. Mereka yang menyukai warna ungu memiliki sifat yang sensitif.

Pecinta warna ungu juga adalah orang yang pengertian dan tidak segan untuk memberikan dukungannya kepada siapa pun. Mereka biasanya lebih memikirkan orang lain daripada dirinya sendiri sehingga dia tak segan-segan untuk menolong siapa pun yang membutuhkannya.

Berikut adalah jenis-jenis warna ungu beserta kodenya.

Daftar Kode Warna Ungu
KODE WARNA JENIS WARNA
#e6e6fa
#d8bfd8
#dda0dd
#ee82ee
#da70d6
#ba55d3
#9932cc
#8a2be2
#9370db
#6a5acd
#483d8b
#ff00ff
#9400d3
#8b008b
#800080
#4b0082

Warna merah muda merupakan perpaduan antara warna merah dan warna putih. Seseorang yang menyukai warna merah muda atau biasa disebut warna pink memiliki sisi feminim yang kuat.

Warna merah muda lebih banyak disukai oleh kaum wanita, karena warna ini menggambarkan suatu kelembutan, cinta, dan ketenangan. Dan warna ini juga dapat menunjukkan sifat yang kekanak-kanakan dan suka bermanja terutama pada orang yang mereka sayang.

Warna merah muda sangat baik digunakan untuk acara kencan yang romantis. Pecinta warna merah muda selalu melakukan sesuatu dengan perencanaan yang matang. Namun, mereka agak misterius karena mereka juga menyukai hal-hal yang berbau mistis.

Berikut adalah jenis-jenis warna merah muda beserta kodenya.

Daftar Kode Warna Merah Muda
KODE WARNA JENIS WARNA
#ffc0cb
#ffb6c1
#db7093
#ff69b4
#ff1493
#c71585


Baca Juga : Daftar Kode Warna Putih Dan Hitam

Itulah Daftar Kode Warna Ungu Dan Merah Muda, dan semoga bermanfaat.

Daftar Kode Warna Merah

Dalam psikologi, warna merah merupakan simbol energi, gairah, kekuatan dan kegembiraan. Warna merah adalah warna yang hangat dan ekstrim, yang dapat meningkatkan nilai positif dalam diri untuk bertahan hidup.

Menyukai warna merah menandakan memiliki jiwa kepemimpinan dan ambisi yang kuat untuk meraih sesuatu. Warna merah dapat membuat perhatian tertuju kepadanya, karena warna ini lebih mencolok dari warna lain bila disandingkan.

Warna merah adalah warna yang punya banyak arti, mulai dari cinta yang menggairahkan hingga kekerasan dalam perang. Warna merah ini tidak hanya mempengaruhi psikologi, namun juga mempengaruhi fisik. Misalnya, menatap warna merah bisa meningkatkan detak jantung dan membuat kita bernapas lebih cepat.

Warna merah memiliki sifat positif yaitu tindakan, energi, menarik perhatian, tegas, percaya diri, bersemangat, berani dan kuat.
Warna merah juga memiliki sifat negatif yaitu keras kepala, pemarah, brutal, kejam, agresif dan tidak toleran.

Warna merah juga dapat membangkitkan nafsu makan, sering digunakan dalam restoran atau sajian makan lainnya. Warna merah dapat menggairahkan emosi dan mengilhami kita untuk mengambil tindakan.

Warna merah dapat memberikan kepercayaan kepada mereka yang pemalu. Anak-anak yang pemalu akan lebih bersemangat jika sering memakai baju warna merah. Dan warna merah juga universal untuk bahaya. Itu sebabnya warna lampu lalu lintas diberi warna merah sebagai tanda berhenti.

Berikut adalah jenis-jenis warna merah beserta kodenya.

Daftar Kode Warna Merah
KODE WARNA JENIS WARNA
#ffa07a
#e9967a
#fa8072
#f08080
#cd5c5c
#b22222
#dc143c
#ff0000
#f80000
#f00000
#e80000
#e00000
#d80000
#d00000
#c80000
#c00000
#b80000
#b00000
#a80000
#a00000
#980000
#900000
#880000
#800000
#780000
#700000
#680000
#600000
#580000
#500000
#480000
#400000
#380000
#300000
#280000
#200000
#180000
#100000
#080000


Baca Juga : Daftar Kode Warna Biru

Itulah Daftar Kode Warna Merah, dan semoga bermanfaat.

Daftar Kode Warna Putih Dan Hitam

Warna putih merupakan warna netral, dan sering dilambangkan dengan kemurnian, kedamaian dan kepolosan. Warna putih mampu menunjukkan rasa permohonan maaf, kesederhanaan, kesempurnaan dan keamanan.

Pada umumnya, pecinta warna putih adalah tipe orang yang cinta kedamaian dan tipe orang yang tulus. Penampilan mereka pun terlihat sederhana dan anggun. Mereka juga mudah berteman pada siapa saja, tapi hanya sedikit teman yang mampu menjadi teman dekatnya untuk saling berbagi.

Pada dunia kesehatan, warna putih di rumah sakit digunakan untuk memberikan kesan steril. Akan tetapi, penggunaan warna putih juga dapat memberikan rasa sakit kepala dan kelelahan mata akibat pantulan cahaya yang mengenainya. Warna putih pada suatu objek dapat memberi efek ketentraman dan kenyamanan.

Warna hitam merupakan warna yang melambangkan keanggunan, kemakmuran, percaya diri, kuat, maskulin, dramatis, tegas dan misterius. Dan warna hitam juga sering dilambangkan dengan kematian dan kesedihan.

Pecinta warna hitam biasanya adalah mereka yang mempunyai sifat pendiam dan menyimpan rahasia, tapi mereka tegas dan percaya diri. Untuk penampilan, mereka selalu berusaha untuk tampil menarik dan rapi.

Dalam pergaulan, mereka orang cuek dan tidak memikirkan pendapat orang lain tentang dirinya. Tapi pecinta warna hitam ini, enak diajak untuk berteman dan bisa memberikan solusi untuk masalah yang dihadapi temannya.

Warna hitam dalam arti positif adalah berkemauan keras, disiplin, berwibawa, anggun, serius, dramatis, tegas dan misterius. Dan dalam arti negatif adalah kerahasian, kesedihan, malapetaka, kegaiban dan kematian.

Berikut adalah daftar warna putih dan warna hitam beserta kodenya.

Daftar Kode Warna Putih Dan Hitam
KODE WARNA JENIS WARNA
#ffffff
#f8f8f8
#f0f0f0
#e8e8e8
#e0e0e0
#d8d8d8
#d0d0d0
#c8c8c8
#c0c0c0
#b8b8b8
#b0b0b0
#a8a8a8
#a0a0a0
#989898
#909090
#888888
#808080
#787878
#707070
#686868
#606060
#585858
#505050
#484848
#404040
#383838
#303030
#282828
#202020
#181818
#101010
#080808
#000000


Baca Juga : Daftar Kode Warna Coklat

Itulah Daftar Kode Warna Putih Dan Hitam, dan semoga bermanfaat.

Kumpulan Tombol Show Dan Hide Responsive

Dengan menggunakan tombol show dan hide, anda dapat mengurangi beban loading halaman website atau blog yang anda kelola. 
Yakni dengan cara membuat tombol show untuk menampilkan konten, dan tombol hide untuk menyembunyikan konten, seperti : teks atau tulisan, gambar, video, dan lain-lain.


Membuat tombol show hide pada artikel blog merupakan solusi yang tepat jika anda memiliki artikel yang sangat panjang. Dari sekian banyak tombol show hide yang bisa kita dapat dari blog orang lain, ada baiknya juga anda mencoba tombol show hide yang saya bagikan ini.

Di bawah ini saya menyediakan beberapa contoh tombol show dan hide yang bisa anda coba, berikut adalah Kumpulan Tombol Show Dan Hide Responsive :

1. TOMBOL A

Kode :
<script language="javascript">
function toggle() {
var ele = document.getElementById("Sembunyikan");
var text = document.getElementById("Tampilkan");
if(ele.style.display == "block") {
ele.style.display = "none";
text.innerHTML = "Tampilkan";
}
else {
ele.style.display = "block";
text.innerHTML = "Sembunyikan";
}
}
</script>
<a href="javascript:toggle();" id="Tampilkan" rel="nofollow" style="border: 1px solid #000000; font-family: &quot;josefin sans&quot; , serif; font-size: 16px; height: auto; padding: 2px; text-decoration: none; width: auto;">Tampilkan</a>
<br />
<div id="Sembunyikan" style="border: 1px solid #666666; display: none; margin-bottom: 15px; padding: 10px; width: 280px;">
TERIMA KASIH TELAH BERKUNJUNG KE BLOG INI</div>

Hasilnya :

Tampilkan


2. TOMBOL B

Kode :
<div style="margin: 0 auto; text-align: left;">
<div class="nagastar" style="margin-bottom: 2px;">
<input 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 = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" style="font-family: &quot;josefin sans&quot; , serif; font-size: 16px; padding: 2px;" type="button" value="Show" />
</div>
<div class="nagastar2" style="border: 2px inset; padding: 10px; solid: #000000; width: 280px;">
<div style="display: none;">
TERIMA KASIH TELAH BERKUNJUNG KE BLOG INI</div>
</div>
</div>

Hasilnya :

TERIMA KASIH TELAH BERKUNJUNG KE BLOG INI


3. TOMBOL C

Kode :
<div id="Button" style="font-family: &quot;josefin sans&quot; , serif; font-size: 16px; margin: 0 auto; padding: 2px; text-align: left;">
<input onclick="document.getElementById('Content').style.display='block';Button.style.display='none';" type="button" value="Buka" />
</div>
<div id="Content" style="background: #fff; border: 2px solid #aaa; box-shadow: 0px 1px 3px 0px rgba(179 , 179 , 179 , 1); display: none; margin: 0 auto; padding: 10px; text-align: center; width: 280px;">
TERIMA KASIH TELAH BERKUNJUNG KE BLOG INI
<br />
<input onclick="document.getElementById('Content').style.display='none';Button.style.display='block';" type="button" value="Tutup" />
</div>

Hasilnya :



4. TOMBOL D

Kode :
<div id="spoiler">
<div style="margin: 5px 20px 20px;">
<div class="smallfont" style="margin-bottom: 2px;">
<input 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 = 'Sembunyikan'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Tampilkan'; }" style="font-family: &quot;josefin sans&quot; , serif; font-size: 16px; margin: 0px; padding: 2px; width: auto;" type="button" value="Tampilkan" /></div>
<div class="alt2" style="background: #6a5acd none repeat scroll 0% 0%; border: 2px solid white; color: white; margin: 0px; padding: 2px; text-align: center; width: 280px;">
<div style="display: none;">
TERIMA KASIH TELAH BERKUNJUNG KE BLOG INI
</div>
</div>
</div>
</div>

Hasilnya :

TERIMA KASIH TELAH BERKUNJUNG KE BLOG INI


5. TOMBOL E

Kode :
<div id="nagastar2" style="display: none;">
TERIMA KASIH TELAH BERKUNJUNG KE BLOG INI</div>
<button onclick="if(document.getElementById('nagastar2') .style.display=='none') {document.getElementById('nagastar2') .style.display=''}else{document.getElementById('nagastar2') .style.display='none'}" style="background: #6a5acd; color: white; font-family: &quot;josefin sans&quot; , serif; font-size: 16px; padding: 4px; width: auto;" title="Klik Untuk Melihat" type="button">Show/Tutup</button>

Hasilnya :



6. TOMBOL F

Kode :
<div style="margin: 5px;">
<div class="bigfont" style="margin-bottom: 2px;">
<input 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 = 'TUTUP'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'BUKA'; }" style="color: slateblue; font-family: &quot;josefin sans&quot; , serif; font-size: 12px; margin: 0px; padding: 2px; width: auto;" type="button" value="BUKA" />
</div>
<div class="alt2" style="border: 0px inset; margin: 0px; padding: 6px;">
<div style="display: none;">
TERIMA KASIH<br />
TELAH BERKUNJUNG<br />
KE<br />
BLOG INI
</div>
</div>
</div>

Hasilnya :

TERIMA KASIH
TELAH BERKUNJUNG
KE
BLOG INI


7. TOMBOL G

Kode :
<script type="text/javascript">
        function showHideContent(id){           if(document.getElementById(id).style.display==""){                 document.getElementById(id).style.display="none";
             }else{                 document.getElementById(id).style.display="";
             }
       } 
    </script>             
<br />
<div id="contents">
<a href="javascript:;" onclick="showHideContent('contents_hide')">
                      </a>
<br />
<center>
<a href="javascript:;" onclick="showHideContent('contents_hide')"><b>Tentang Saya</b></a></center>
<a href="javascript:;" onclick="showHideContent('contents_hide')">
           </a>         
<br />
<div id="contents_hide">
Nama Blog    : Lazio Alfaro<br />
Nama Penulis : Naga Star<br />
Alamat       : Indonesia</div>
</div>
<script type="text/javascript">
        showHideContent('contents_hide');
    </script>

Hasilnya :


Tentang Saya
Nama Blog : Lazio Alfaro
Nama Penulis : Naga Star
Alamat : Indonesia


8. TOMBOL H

Kode :
<div id="spoiler3" style="display: none;">
TERIMA KASIH TELAH BERKUNJUNG KE BLOG INI</div>
<button onclick="if(document.getElementById('spoiler3') .style.display=='none') {document.getElementById('spoiler3') .style.display=''}else{document.getElementById('spoiler3') .style.display='none'}" style="background: white; border: 3px double #6a5acd; color: slateblue; font-family: &quot;josefin sans&quot; , serif; font-size: 12px; padding: 4px 2px 2px 2px;" type="button">SHOW / HIDE</button>

Hasilnya :



9. TOMBOL UNTUK GAMBAR

Kode :
<script src="jquery-1.7.min.js" type="text/javascript"></script>
 <script>
 $(document).ready(function(){
        $('.gambar').hide();       
        $('.Open').click(function(){
   $('.gambar').show();
        });
        $('.Close').click(function(){
   //Sembunyikan elemen class gambar
   $('.gambar').hide();     
        });
 });
 </script>
<input class="Open" type="button" value="Open" />
<input class="Close" type="button" value="Close" />
 <div class="gambar">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqZzL1GfWqZbgJEo6Dyakrmcqi0sbTiVUUov85q777vTSjs7o-Cvz4tncwMPZzXa6pyr8j4l9B3UcdGrsri9_uym4OFuVfOmzuPZGsNwrRhlVlW-u_9wgzBi8Mq3iT6twhy_zQHQuu690F/s320/Naga+Star.png" />
 </div>

Hasilnya :




10. TOMBOL UNTUK VIDEO

Kode :
<div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;">
<input 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 = 'Sembunyikan'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Tampilkan'; }" style="font-family: &quot;josefin sans&quot; , serif; font-size: 16px; margin: 0px; padding: 2px; width: auto;" type="button" value="Tampilkan" /></div>
<div class="alt2" style="background: white; border: 0px inset; margin: 0px; padding: 6px;">
<div style="display: none;">
<iframe allowfullscreen="" frameborder="0" height="150" src="//www.youtube.com/embed/f8D7ElBHar0?feature=player_detailpage" width="210"></iframe>
</div>
</div>
</div>

Hasilnya :


Baca Juga : Cara Gampang Cegah Copy Paste Pada Blog

Itulah beberapa Kumpulan Tombol Show Dan Hide Responsive yang bisa anda coba, dan silahkan untuk mencobanya.