<?xml version='1.0' encoding='UTF-8'?><rss xmlns:atom="http://www.w3.org/2005/Atom" xmlns:openSearch="http://a9.com/-/spec/opensearchrss/1.0/" xmlns:blogger="http://schemas.google.com/blogger/2008" xmlns:georss="http://www.georss.org/georss" xmlns:gd="http://schemas.google.com/g/2005" xmlns:thr="http://purl.org/syndication/thread/1.0" version="2.0"><channel><atom:id>tag:blogger.com,1999:blog-237919773872468803</atom:id><lastBuildDate>Fri, 01 Nov 2024 08:02:15 +0000</lastBuildDate><category>Tips N&#39; Trik</category><category>HTML</category><category>Tools</category><category>Computer</category><category>Photo Editing</category><category>Kamus</category><category>LOMBA BLOG DOMPET DHUAFA HONG KONG</category><category>PC Optimizer</category><category>Text Editor</category><category>Video Player</category><category>Antivirus</category><category>Audio Player</category><category>Blogging</category><category>Browser</category><category>Files Recovery</category><category>Icons</category><category>Lomba Blogging</category><category>Peluncuran Amirabella Zone</category><category>Video Converter</category><title>Amirabella - Zone</title><description>Free Download Software, Tutorial, Tips and Trik</description><link>http://amirabella-zone.blogspot.com/</link><managingEditor>noreply@blogger.com (Anonymous)</managingEditor><generator>Blogger</generator><openSearch:totalResults>86</openSearch:totalResults><openSearch:startIndex>1</openSearch:startIndex><openSearch:itemsPerPage>25</openSearch:itemsPerPage><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-8190600413956161604</guid><pubDate>Tue, 04 Aug 2015 18:05:00 +0000</pubDate><atom:updated>2015-08-05T02:44:12.614+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Lomba Blogging</category><title>Kiprah Nyata BNI bagi BMI di Hong Kong</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIXVP5MDfU3gCfcvqthFyVBsD6GDUVpUbl5ihnjP5l0vlTXF8KSlK7IG6RuRm9FPuXaAb9SrD-YVXrLeqtXYU1HRBHigfthj9MghYfF2IyDsS8fuLopWo6KQ4s0x1CkIRnfxm6cV4tfBI/s1600/69+Tahun+BNI.jpg&quot; imageanchor=&quot;1&quot; style=&quot;clear: left; float: left; margin-bottom: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIXVP5MDfU3gCfcvqthFyVBsD6GDUVpUbl5ihnjP5l0vlTXF8KSlK7IG6RuRm9FPuXaAb9SrD-YVXrLeqtXYU1HRBHigfthj9MghYfF2IyDsS8fuLopWo6KQ4s0x1CkIRnfxm6cV4tfBI/s1600/69+Tahun+BNI.jpg&quot; style=&quot;width:200px; height:150px;margin-top:5px;&quot; alt=&quot;Kiprah Nyata BNI bagi BMI di Hong Kong&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Bank BNI merupakan salah satu Bank terbesar yang berstatus Badan Usaha Milik Negara (BUMN) yang dimiliki oleh Negara Kesatuan Republik Indonesia. Wilayah Operasinya meliputi seluruh nusantara bahkan manca negara termasuk di Republik Hong Kong. Di Hong Kong sendiri Bank BNI adalah Bank yang memiliki kantor terbesar dengan pelayanan terbaik diatara Bank-bank dari Indonesia lainnya. Kantor Bank BNI cabang Hong Kong beralamatkan di &lt;i&gt;G/F, Far East Finance Center 16 Hartcourt Road&lt;/i&gt;.&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Seperti yang kita ketahui sekarang di Hong Kong terdapat lebih dari 150 ribu Buruh Migran Indonesia (BMI) yang bekerja disektor formal maupun non-formal. Sektor formal dengan gaji standar pemerintah Hong Kong yaitu sebesar HKD 4110 dan pekerja non-formal dengan gaji yang bervariasi, maka sudah sangat wajar jika para BMI membutuhkan kiprah bank-bank untuk memudahkan para BMI dalam bertransaksi seperti menabung, cek saldo, penarikan uang, maupun mengirim uang melalui layanan transfer antar rekening Bank dan transaksi lainnya. &lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Perlu diketahui bahwa di Hong Kong terdapat kurang lebih 5 bank asal Indonesia untuk memudahkan transaksi para BMI. Tapi yang saya ketahui diantara bank-bank lain hanya BNI yang mempunyai kelebihan dan kiprah nyata bagi para BMI. Salah satunya yaitu menjadi satu-satunya Bank yang bekerja sama dengan KJRI Hong Kong sebagai tempat pembayaran untuk membuat atau &lt;i&gt;renew passport&lt;/i&gt; dan ini sangat membantu sekali bagi para BMI sehingga tidak perlu mengantri terlalu lama di KJRI karena waktu para BMI sangatlah terbatas. &lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;BNI adalah satu-satunya Bank di Hong Kong yang dapat langsung melakukan &lt;i&gt;print out&lt;/i&gt; pada buku tabungan ketika nasabah menabung dan tanpa dipungut biaya/gratis, hal itu berbeda dengan Bank asal Indonesia lainnya yang mengenakan biaya sebesar HK$ 30 dan harus menunggu 1 bulan setiap pencetakan buku tabungan. Maka tidaklah heran bila setiap hari di bank BNI pasti akan terlihat antrian yang panjang yang notabene adalah mbak-mbak BMI entah untuk keperluan menabung maupun melakukan transaksi lainnya.&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Nasabah Bank BNI diberikan kemudahan dengan adanya fasilitas ATM &lt;i&gt;(Automated Teller Machine)&lt;/i&gt; yang tersebar di berbagai titik strategis di wilayah Hong Kong. Dengan adanya mesin ATM di setiap sudut area yang menjadi &lt;i&gt;tongkrongan&lt;/i&gt; para BMI, sangat memudahkan para BMI untuk melakukan transaksi seperti penarikan uang, cek saldo, transfer antar rekening sesama BNI maupun Bank lain, pembayaran tagihan listrik dll. Dan yang lebih membanggakan lagi Bank BNI adalah Bank asal Indonesia yang pertama memiliki ATM sendiri di wilayah Hong Kong.&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Selain memberikan layanan kepada para nasabah, BNI juga ikut berpartisipasi dalam mengedukasi BMI yang merupakan generasi penerus bangsa dengan mengadakan seminar-seminar, menjadi sponsor kegiatan kerohanian seperti mendatangkan ustad/penceramah dalam acara siraman rohani. Hal ini merupakan kiprah BNI yang patut kita apresiasi.&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Tidak hanya sekedar itu, Bank BNI juga rutin mengadakan acara tahunan untuk memeriahkan &lt;i&gt;weekend&lt;/i&gt; BMI seperti mengadakan festival band, lomba tari dan tarik suara dimana hal ini dapat memicu kreativitas BMI dalam berkarya dalam bidang seni dan sekaligus melestarikan kebudayaan bangsa yang kita cintai.&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Melihat wujud nyata layanan yang diberikan BNI bagi BMI di Hong Kong, maka kiprah BNI sudah benar-benar nyata bagi para BMI. Secara tidak langsung BNI menciptakan generasi yang gemar menabung untuk masa depan yang lebih baik. Satu lagi kiprah BNI yang selalu akan saya ingat adalah disetiap event-event besar para BMI entah itu acara kemanusiaan, konser musik dan lain-lain, BNI selalu ada untuk menjadi sponsor. Tak heran bila BNI selalu dihati para nasabah BMI di Hong Kong karena BNI memang bisa memanjakan para nasabahnya. &lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Selamat Ulang Tahun BNI, Terima kasih karena Anda masa depan kami jadi terencana dengan baik. #69TahunBNI&lt;/p&gt;</description><link>http://amirabella-zone.blogspot.com/2015/08/kiprah-nyata-bni-bagi-bmi-di-hong-kong.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIXVP5MDfU3gCfcvqthFyVBsD6GDUVpUbl5ihnjP5l0vlTXF8KSlK7IG6RuRm9FPuXaAb9SrD-YVXrLeqtXYU1HRBHigfthj9MghYfF2IyDsS8fuLopWo6KQ4s0x1CkIRnfxm6cV4tfBI/s72-c/69+Tahun+BNI.jpg" height="72" width="72"/><thr:total>0</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-8888789542280875379</guid><pubDate>Tue, 03 Feb 2015 16:52:00 +0000</pubDate><atom:updated>2015-02-04T04:24:00.705+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">HTML</category><title>Cara Membuat Images Slider Tanpa Jquery</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_QwjOhpNnx7iF1i2O7jFMu6t6Y_FnzLN5bplwEirj1LaBZ8h6NXmriHrG_13Tuv-ZLONmViNc0f1tHZLpVVSC9DtzK1W8dgJZKz-bO5eqzkWalfa8zXnnOYlHpz97WnsXRphhUfexyx8/s1600/CSS3-Slider.jpg&quot; imageanchor=&quot;1&quot; style=&quot;clear: left; float: left; margin-bottom: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_QwjOhpNnx7iF1i2O7jFMu6t6Y_FnzLN5bplwEirj1LaBZ8h6NXmriHrG_13Tuv-ZLONmViNc0f1tHZLpVVSC9DtzK1W8dgJZKz-bO5eqzkWalfa8zXnnOYlHpz97WnsXRphhUfexyx8/s1600/CSS3-Slider.jpg&quot; alt=&quot;Cara Membuat Images Slider Tanpa Jquery&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Pada posting sebelumnya saya share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2015/01/cara-memasukkan-playlist-lagu-pada.html&quot; target=&quot;_blank&quot;&gt;&lt;i&gt;&amp;#39;Cara Memasukkan Playlist Lagu Pada Dokumen HTML&amp;#39;&lt;/i&gt;&lt;/a&gt;, sekarang saya lanjutkan dengan share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2015/02/cara-membuat-images-slider-tanpa-jquery.html&quot;&gt;&lt;i&gt;&amp;#39;Cara Membuat Images Slider Tanpa Jquery&amp;#39;&lt;/i&gt;&lt;/a&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;CSS3 Slider&lt;/b&gt; adalah sebuah &lt;i&gt;images slideshow&lt;/i&gt; yang dibuat menggunakan &lt;i&gt;CSS3 (Cascading Style Sheets)&lt;/i&gt; tanpa melibatkan jquery. Dengan tidak digunakannya &lt;i&gt;jquery&lt;/i&gt; pada &lt;i&gt;slider&lt;/i&gt; ini maka otomatis akan membuat &lt;i&gt;script&lt;/i&gt; semakin ringan dan website pun dapat diakses dengan lebih cepat, namun bukan berarti &lt;i&gt;CSS3 Slider&lt;/i&gt; lebih baik dari &lt;i&gt;slider&lt;/i&gt; yang berbasis &lt;i&gt;jquery&lt;/i&gt; karena keduanya mempunyai kekurangan dan kelebihan masing-masing. Salah satu kelebihan &lt;i&gt;slider&lt;/i&gt; yang berbasis &lt;i&gt;jquery&lt;/i&gt; kita dapat menambahkan jumlah &lt;i&gt;image (file gambar)&lt;/i&gt; dengan mudah tanpa mengotak-atik lagi &lt;i&gt;Css&lt;/i&gt; dan &lt;i&gt;jquery&lt;/i&gt;&amp;#39;nya. Hal ini berbeda apabila menggunakan &lt;i&gt;CSS3 Slider&lt;/i&gt;, setiap kali menambahkan jumlah file &lt;i&gt;image (gambar)&lt;/i&gt; kita harus meng&amp;#39;edit &lt;i&gt;CSS&lt;/i&gt;&amp;#39;nya agar &lt;i&gt;slider&lt;/i&gt; dapat bekerja dengan semestinya. Untuk mengatasi hal tersebut kabar baiknya adalah Saya menyertakan contoh &lt;i&gt;CSS3 Slider&lt;/i&gt; ini dalam beberapa jumlah gambar yang berbeda mulai dari yang berjumlah 4 s/d 20 gambar yang dapat Anda download pada akhir artikel ini.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;
Artikel terkait: &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/03/cara-membuat-images-slideshow-pada.html&quot; target=&quot;_blank&quot;&gt;Cara Membuat Images Slideshow Menggunakan Jquery&lt;/a&gt;
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Baiklah berikut ini cara membuat &lt;b&gt;&lt;i&gt;CSS3 Slider&lt;/i&gt;&lt;/b&gt; pada sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;.
&lt;/p&gt;

&lt;br /&gt;

&lt;div&gt;
&lt;div style=&quot;margin-bottom: 10px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;&lt;u&gt;Langkah-langkah:&lt;/u&gt;&lt;/b&gt;&lt;/span&gt;
&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;&quot;&gt;
&lt;div&gt;

&lt;p style=&quot;text-align:justify;margin:15px&quot;&gt;&lt;b&gt;&lt;u&gt;Cara Membuat Images Slider Tanpa Jquery:&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;

&lt;ol style=&quot;margin-right:15px;&quot;&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;Jalankan aplikasi &lt;i&gt;text editor&lt;/i&gt; seperti &lt;i&gt;&amp;#39;notepad&amp;#39;&lt;/i&gt; untuk menulis sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;. Mungkin &lt;i&gt;notepad&lt;/i&gt; bawaan &lt;i&gt;windows&lt;/i&gt; kurang begitu menarik, solusinya Anda dapat menggunakan aplikasi &lt;i&gt;notepad++&lt;/i&gt; yang dapat Anda download &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-notepad-63.html&quot; target=&quot;_blank&quot;&gt;di sini&lt;/a&gt;.&lt;/li&gt;
 &lt;br /&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;&lt;b&gt;&lt;i&gt;Penting!&lt;/i&gt;&lt;/b&gt; simpan dokumen &lt;i&gt;HTML&lt;/i&gt; dengan format &lt;b&gt;&lt;i&gt;&amp;#39;Nama_File.html&amp;#39;&lt;/i&gt;&lt;/b&gt; tanpa tanda kutip, kemudian pada &lt;i&gt;&amp;#39;Save as type&amp;#39;&lt;/i&gt; Anda pilih &lt;i&gt;&amp;#39;All files&amp;#39;&lt;/i&gt; agar dokumen yang Anda simpan menjadi dokumen &lt;i&gt;HTML&lt;/i&gt; bukan dokumen &lt;i&gt;text biasa&lt;/i&gt;.&lt;/li&gt; 
 &lt;br /&gt; 
 &lt;li style=&quot;text-align:justify&quot;&gt;Sekarang mari kita mulai untuk membuat &lt;i&gt;CSS3 Slider&lt;/i&gt; pada dokumen &lt;i&gt;HTML&lt;/i&gt; seperti pada kotak di bawah ini.&lt;/li&gt;
 
 &lt;br /&gt;
 
 &lt;div style=&quot;margin-bottom: 10px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;&lt;i&gt;&lt;u&gt;Script Code:&lt;/u&gt;&lt;/i&gt;&lt;/b&gt;&lt;/span&gt;
&lt;/div&gt;

&lt;div&gt;

&lt;div style=&quot;margin: 0px; padding: 20px; border: 1px inset;&quot;&gt;

  &lt;span style=&quot;color:#f83ab8;&quot;&gt;&amp;lt;!DOCTYPE html&amp;gt;&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;span style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;html&amp;gt;&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;span style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;head&amp;gt;&lt;/span&gt;&lt;br /&gt;
  &lt;span style=&quot;color:#59fa38;&quot;&gt;&amp;lt;title&amp;gt;&lt;/span&gt; Cara Membuat Images Slider Tanpa Jquery &lt;span style=&quot;color:#59fa38;&quot;&gt;&amp;lt;/title&amp;gt;&lt;/span&gt;&lt;br /&gt;
  &lt;br /&gt;
  &amp;lt;link rel=&amp;quot;stylesheet&amp;quot; type=&amp;quot;text/css&amp;quot; href=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Url File CSS&lt;/span&gt;&amp;quot; /&amp;gt;
  &lt;br /&gt;&lt;br /&gt;
  
  &lt;span style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;/head&amp;gt;&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;

  &lt;span style=&quot;color:#FF6600;&quot;&gt;&amp;lt;body&amp;gt;&lt;/span&gt;&lt;br /&gt;
  &lt;br /&gt;
  &lt;span style=&quot;color:#de18ea;&quot;&gt;&amp;lt;!-- Begin Slider --&amp;gt;&lt;/span&gt;&lt;br /&gt;
  &lt;br /&gt;
  &lt;span style=&quot;color:red;background:yellow;&quot;&gt;&amp;nbsp;Copy dan Paste Script HTML Di Sini&amp;nbsp;&lt;/span&gt;&lt;br /&gt;
  &lt;br /&gt;
  &lt;span style=&quot;color:#de18ea;&quot;&gt;&amp;lt;!-- // End Slider --&amp;gt;&lt;/span&gt;&lt;br /&gt;
  &lt;br /&gt;
    
  &lt;span style=&quot;color:#FF6600;&quot;&gt;&amp;lt;/body&amp;gt;&lt;/span&gt;&lt;br /&gt;
  &lt;span style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;/html&amp;gt;&lt;/span&gt;
&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;&lt;u&gt;Keterangan:&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;
&lt;ol style=&quot;text-align:justify;&quot;&gt;
&lt;li&gt;Ganti &lt;span style=&quot;color:red;&quot;&gt;&amp;#39;Url File CSS&amp;#39;&lt;/span&gt; dengan Url tempat Anda menyimpan file &lt;i&gt;CSS&lt;/i&gt;. Silahkan lihat script &lt;i&gt;CSS&lt;/i&gt;&amp;#39;nya di bawah.&lt;/li&gt;
&lt;li&gt;Copy dan Pasti script HTML tepat sesuai instruksi di atas. &lt;i&gt;(Scriptnya sudah disertakan di bawah)&lt;/i&gt;.&lt;/li&gt;
&lt;/ol&gt;

  &lt;br /&gt;

  &lt;div style=&quot;border-top:#000 dotted 1px;&quot;&gt;&amp;nbsp;&lt;/div&gt;

&lt;div&gt;
&lt;div style=&quot;margin-bottom: 5px;&quot;&gt;
&lt;span style=&quot;font-size: large; font-weight:bold;&quot;&gt;HTML Script:&lt;/span&gt;
&lt;input value=&quot;Buka&quot; type=&quot;button&quot; onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot;&gt;&lt;/div&gt;
&lt;div style=&quot;margin: 0px; padding: 10px; border: 1px inset;&quot;&gt;
&lt;div style=&quot;padding: 10px; display: none; overflow:hidden;&quot;&gt;

&amp;lt;div class=&amp;quot;slider&amp;quot;&amp;gt;&lt;br /&gt;
    &amp;lt;ul&amp;gt; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;     &amp;lt;li&amp;gt; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;      &amp;lt;a href=&amp;quot;&lt;span style=&quot;color:#3abcf8;&quot;&gt;Url-Target&lt;/span&gt;&amp;quot; target=&amp;quot;_blank&amp;quot;&amp;gt;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;   &amp;lt;img alt=&amp;quot;Images 1&amp;quot; src=&amp;quot;&lt;span style=&quot;color:#FF6600;&quot;&gt;Url-images-1&lt;/span&gt;&amp;quot; /&amp;gt;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;   &amp;lt;/a&amp;gt;&lt;br /&gt;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;      &amp;lt;div&amp;gt; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;       &amp;lt;h3&amp;gt;&lt;span style=&quot;color:#FF6600;&quot;&gt;Title #1&lt;/span&gt;&amp;lt;/h3&amp;gt; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    &amp;lt;p&amp;gt;&lt;span style=&quot;color:#3abcf8;&quot;&gt;Content Text...&lt;/span&gt;&amp;lt;/p&amp;gt; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;   &amp;lt;/div&amp;gt;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;  &amp;lt;/li&amp;gt; &lt;br /&gt;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;  &amp;lt;li&amp;gt; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;      &amp;lt;a href=&amp;quot;&lt;span style=&quot;color:#3abcf8;&quot;&gt;Url-Target&lt;/span&gt;&amp;quot; target=&amp;quot;_blank&amp;quot;&amp;gt;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;   &amp;lt;img alt=&amp;quot;Images 2&amp;quot; src=&amp;quot;&lt;span style=&quot;color:#FF6600;&quot;&gt;Url-images-2&lt;/span&gt;&amp;quot; /&amp;gt;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;   &amp;lt;/a&amp;gt;&lt;br /&gt;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;      &amp;lt;div&amp;gt; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;       &amp;lt;h3&amp;gt;&lt;span style=&quot;color:#FF6600;&quot;&gt;Title #2&lt;/span&gt;&amp;lt;/h3&amp;gt; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;       &amp;lt;p&amp;gt;&lt;span style=&quot;color:#3abcf8;&quot;&gt;Content Text...&lt;/span&gt;&amp;lt;/p&amp;gt; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;   &amp;lt;/div&amp;gt; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;  &amp;lt;/li&amp;gt; &lt;br /&gt;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;  &amp;lt;li&amp;gt; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;      &amp;lt;a href=&amp;quot;&lt;span style=&quot;color:#3abcf8;&quot;&gt;Url-Target&lt;/span&gt;&amp;quot; target=&amp;quot;_blank&amp;quot;&amp;gt;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;   &amp;lt;img alt=&amp;quot;Images 3&amp;quot; src=&amp;quot;&lt;span style=&quot;color:#FF6600;&quot;&gt;Url-images-3&lt;/span&gt;&amp;quot; /&amp;gt;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;   &amp;lt;/a&amp;gt; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;   &amp;lt;div&amp;gt; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;       &amp;lt;h3&amp;gt;&lt;span style=&quot;color:#FF6600;&quot;&gt;Title #3&lt;/span&gt;&amp;lt;/h3&amp;gt; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    &amp;lt;p&amp;gt;Content Text...&amp;lt;/p&amp;gt; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;   &amp;lt;/div&amp;gt; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;  &amp;lt;/li&amp;gt; &lt;br /&gt;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;  &amp;lt;li&amp;gt; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;      &amp;lt;a href=&amp;quot;&lt;span style=&quot;color:#3abcf8;&quot;&gt;Url-Target&lt;/span&gt;&amp;quot; target=&amp;quot;_blank&amp;quot;&amp;gt;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;   &amp;lt;img alt=&amp;quot;Images 4&amp;quot; src=&amp;quot;&lt;span style=&quot;color:#FF6600;&quot;&gt;Url-images-4&lt;/span&gt;&amp;quot; /&amp;gt;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;   &amp;lt;/a&amp;gt; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;      &amp;lt;div&amp;gt; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;       &amp;lt;h3&amp;gt;&lt;span style=&quot;color:#FF6600;&quot;&gt;Title #4&lt;/span&gt;&amp;lt;/h3&amp;gt; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;       &amp;lt;p&amp;gt;&lt;span style=&quot;color:#3abcf8;&quot;&gt;Content Text...&lt;/span&gt;&amp;lt;/p&amp;gt; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;   &amp;lt;/div&amp;gt; &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;  &amp;lt;/li&amp;gt; &lt;br /&gt;     
 &amp;lt;/ul&amp;gt; &lt;br /&gt;
 &amp;lt;/div&amp;gt;&lt;br /&gt;

&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;&lt;u&gt;Keterangan:&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;
&lt;ol style=&quot;text-align:justify;&quot;&gt;
&lt;li&gt;Ganti &lt;span style=&quot;color:#3abcf8;&quot;&gt;Url-Target&lt;/span&gt; sesuai dengan target halaman &lt;i&gt;web&lt;/i&gt; yang Anda kehendaki.&lt;/li&gt;
&lt;li&gt;Ganti &lt;span style=&quot;color:#FF6600;&quot;&gt;Url-images&lt;/span&gt; sesuai dengan &lt;i&gt;Url&lt;/i&gt; tempat Anda menyimpan file gambar.&lt;/li&gt;
&lt;li&gt;Ganti &lt;span style=&quot;color:#FF6600;&quot;&gt;Title&lt;/span&gt; dengan &lt;i&gt;Title&lt;/i&gt; yang Anda kehendaki.&lt;/li&gt;
&lt;li&gt;Ganti &lt;span style=&quot;color:#3abcf8;&quot;&gt;Content Text...&lt;/span&gt; sesuai dengan yang Anda kehendaki.&lt;/li&gt;
&lt;/ol&gt;

&lt;br /&gt;
&lt;div style=&quot;border-top:#000 dotted 1px;&quot;&gt;&amp;nbsp;&lt;/div&gt;
 
&lt;div&gt;
&lt;div style=&quot;margin-bottom: 5px;&quot;&gt;
&lt;span style=&quot;font-size: large; font-weight:bold;&quot;&gt;CSS Script:&lt;/span&gt;
&lt;input value=&quot;Buka&quot; type=&quot;button&quot; onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot;&gt;&lt;/div&gt;
&lt;div style=&quot;margin: 0px; padding: 10px; border: 1px inset;&quot;&gt;
&lt;div style=&quot;padding: 10px; display: none; overflow:hidden;&quot;&gt;

/*---------------------------- Images Slider------------------------------ */&lt;br /&gt;
&lt;br /&gt;
* {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; margin: 0 auto;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    padding: 0;&lt;br /&gt;
}&lt;br /&gt;
&lt;br /&gt;
.slider {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    width: &lt;span style=&quot;color:red;&quot;&gt;500px&lt;/span&gt;; /* important to be same as image width */&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    height: &lt;span style=&quot;color:red;&quot;&gt;300px&lt;/span&gt;; /* important to be same as image height */&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    position: relative; /* important */&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; overflow: hidden; /* important */&lt;br /&gt;
}&lt;br /&gt;
&lt;br /&gt;
.slider ul {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    list-style: none;&lt;br /&gt;
}&lt;br /&gt;
&lt;br /&gt;
/* keyframes #anim_slider */&lt;br /&gt;
@-webkit-keyframes anim_slider {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    0% {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        opacity: 0;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    }&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    6% {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        opacity: 1;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    }&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    24% {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        opacity: 1;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    }&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    30% {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        opacity: 0;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    }&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    100% {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        opacity: 0;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    }&lt;br /&gt;
}&lt;br /&gt;
&lt;br /&gt;
@-moz-keyframes anim_slider {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    0% {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        opacity: 0;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    }&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    6% {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        opacity: 1;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    }&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    24% {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        opacity: 1;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    }&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    30% {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        opacity: 0;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    }&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    100% {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        opacity: 0;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    }&lt;br /&gt;
}&lt;br /&gt;
&lt;br /&gt;
/* animation */&lt;br /&gt;
.slider ul li {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; position: absolute;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; opacity: 0;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    top: 0;&lt;br /&gt;
 &lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -webkit-animation-name: anim_slider;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -webkit-animation-duration: 24.0s;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -webkit-animation-timing-function: linear;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -webkit-animation-iteration-count: infinite;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -webkit-animation-direction: normal;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -webkit-animation-delay: 0;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -webkit-animation-play-state: running;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -webkit-animation-fill-mode: forwards;&lt;br /&gt;
&lt;br /&gt; 
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -moz-animation-name: anim_slider;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -moz-animation-duration: 24.0s;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -moz-animation-timing-function: linear;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -moz-animation-iteration-count: infinite;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -moz-animation-direction: normal;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -moz-animation-delay: 0;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -moz-animation-play-state: running;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -moz-animation-fill-mode: forwards;&lt;br /&gt;
}&lt;br /&gt;
&lt;br /&gt;
/* animation delays */&lt;br /&gt;
.slider ul  li:nth-child(2), .slider ul  li:nth-child(2) div {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -webkit-animation-delay: 6.0s;&lt;br /&gt;
 &amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;   -moz-animation-delay: 6.0s;&lt;br /&gt;
}&lt;br /&gt;
.slider ul  li:nth-child(3), .slider ul  li:nth-child(3) div {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;   -webkit-animation-delay: 12.0s;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -moz-animation-delay: 12.0s;&lt;br /&gt;
}&lt;br /&gt;
.slider ul  li:nth-child(4), .slider ul  li:nth-child(4) div {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -webkit-animation-delay: 18.0s;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -moz-animation-delay: 18.0s;&lt;br /&gt;
}&lt;br /&gt;
&lt;br /&gt;
.slider ul li a {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    text-decoration: none;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; color: #fff;&lt;br /&gt;
}&lt;br /&gt;
&lt;br /&gt;
.slider ul li p {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; color: #fff;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; font-size: 12px;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; margin-top: -5px;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; padding: 10px 15px;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; filter: alpha(opacity=80);&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -moz-opacity: 0.8;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; -khtml-opacity: 0.8;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    opacity: 0.8;&lt;br /&gt;
}

.slider ul li  img a {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;   display: block;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    float: left;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    width: 100%;&lt;br /&gt;
}&lt;br /&gt;
&lt;br /&gt;
/* keyframes #captions */&lt;br /&gt;
@-webkit-keyframes captions {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    0% {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        top: 100%;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        opacity: 0;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    }&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    5% {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        top: 80%;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        opacity: 1;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    }&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    20% {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        top: 80%;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        opacity: 1;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    }&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    25% {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        top: 100%;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        opacity: 0;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    }&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    100% {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        top: 100%;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        opacity: 0;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    }&lt;br /&gt;
}&lt;br /&gt;
&lt;br /&gt;
@-moz-keyframes captions {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    0% {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        top: 100%;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        opacity: 0;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    }&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    5% {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        top: 80%;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        opacity: 1;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    }&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    20% {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        top: 80%;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        opacity: 1;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    }&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    25% {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        top: 100%;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        opacity: 0;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    }&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    100% {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        top: 100%;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;        opacity: 0;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    }&lt;br /&gt;
}&lt;br /&gt;
&lt;br /&gt;
.slider h3 {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; text-transform: uppercase;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; color: #fff;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; font-size: 14px;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; line-height: 14px;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; padding: 10px 15px 0;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; filter: alpha(opacity=80);&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -moz-opacity: 0.8;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; -khtml-opacity: 0.8;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    opacity: 0.8;&lt;br /&gt;
}&lt;br /&gt;
&lt;br /&gt;
.slider ul li div {&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; text-align: center;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    color: #fff;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    background-color: rgba(45, 44, 44, 0.7);&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;   background: rgba(45, 44, 44, 0.7);&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    margin: 0;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    padding: 0;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    position: absolute;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;   bottom: 0;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    width: &lt;span style=&quot;color:red;&quot;&gt;500px&lt;/span&gt;; /* important to be same as image width */&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    z-index :999;&lt;br /&gt;
&lt;br /&gt;
/* css3 animation */&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -webkit-animation-name: captions;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -webkit-animation-duration: 24.0s;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -webkit-animation-timing-function: linear;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -webkit-animation-iteration-count: infinite;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -webkit-animation-direction: normal;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -webkit-animation-delay: 0;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -webkit-animation-play-state: running;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -webkit-animation-fill-mode: forwards;&lt;br /&gt;
&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -moz-animation-name: captions;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -moz-animation-duration: 24.0s;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -moz-animation-timing-function: linear;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -moz-animation-iteration-count: infinite;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -moz-animation-direction: normal;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -moz-animation-delay: 0;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -moz-animation-play-state: running;&lt;br /&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;    -moz-animation-fill-mode: forwards;&lt;br /&gt;
}&lt;br /&gt;

&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt; 

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;&lt;u&gt;Keterangan:&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;
&lt;ol style=&quot;text-align:justify;&quot;&gt;
&lt;li&gt;Ganti value yang berwarna merah &lt;span style=&quot;color:red;&quot;&gt;width&lt;/span&gt; &lt;i&gt;(lebar)&lt;/i&gt; dan &lt;span style=&quot;color:red;&quot;&gt;height&lt;/span&gt; &lt;i&gt;(tinggi)&lt;/i&gt; sesuai dengan panjang dan lebar gambar Anda.&lt;/li&gt;
&lt;li&gt;Copy dan Paste script &lt;i&gt;CSS&lt;/i&gt; di atas pada &lt;i&gt;notepad&lt;/i&gt; dan simpan dengan nama &lt;span style=&quot;color:red;&quot;&gt;slider.css&lt;/span&gt;, pastikan pada &#39;Save as type&#39; Anda pilih &#39;All files&#39; agar dokumen yang Anda simpan menjadi dokumen &lt;i&gt;CSS&lt;/i&gt; bukan dokumen text biasa.&lt;/li&gt;
&lt;/ol&gt;

&lt;/div&gt;

&lt;br /&gt;

&lt;div style=&quot;border-top:#000 dotted 1px;margin-bottom: -20px;&quot;&gt;&amp;nbsp;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;
Baca juga: &lt;a href=&quot;http://www.amirabella-zone.blogspot.com/2015/01/cara-memasukkan-playlist-lagu-pada.html&quot; target=&quot;_blank&quot;&gt;Cara Memasukkan Playlist Lagu Pada Dokumen HTML&lt;/a&gt;
&lt;/p&gt;

&lt;br /&gt;

&lt;div style=&quot;margin-bottom: 10px;&quot;&gt;
&lt;span style=&quot;font-size: large; font-weight:bold;&quot;&gt;Example:&lt;/span&gt;
&lt;/div&gt;

&lt;div&gt;
&lt;style type=&quot;text/css&quot;&gt;


.slider-container {
 width: 500px;
 height: 300px;
 margin: 0px;
 padding: 10px 15px;
 border: 0 inset;
 -moz-border-radius: 5px;   
 -webkit-border-radius: 5px; 
 box-shadow: 0 0 10px #333;
 -moz-box-shadow: 0 0 10px #333;
 -webkit-box-shadow: 0 0 10px #333; 
 overflow: hidden;
}

.slider {
    width: 540px;
    height: 300px;
    position: relative; 
    right: 40px;
 overflow: hidden;
}

.slider ul {
    list-style: none;
}

@-webkit-keyframes anim_slider {
    0% {
        opacity: 0;
    }
    6% {
        opacity: 1;
    }
    24% {
        opacity: 1;
    }
    30% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

@-moz-keyframes anim_slider {
    0% {
        opacity: 0;
    }
    6% {
        opacity: 1;
    }
    24% {
        opacity: 1;
    }
    30% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

.slider ul li { 
 position: absolute;
 opacity: 0;
    top: 0;
 
    -webkit-animation-name: anim_slider;
    -webkit-animation-duration: 24.0s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: normal;
    -webkit-animation-delay: 0;
    -webkit-animation-play-state: running;
    -webkit-animation-fill-mode: forwards;
 
    -moz-animation-name: anim_slider;
    -moz-animation-duration: 24.0s;
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;
    -moz-animation-direction: normal;
    -moz-animation-delay: 0;
    -moz-animation-play-state: running;
    -moz-animation-fill-mode: forwards;
}

.slider ul  li:nth-child(2), .slider ul  li:nth-child(2) div {
    -webkit-animation-delay: 6.0s;
    -moz-animation-delay: 6.0s;
}
.slider ul  li:nth-child(3), .slider ul  li:nth-child(3) div {
    -webkit-animation-delay: 12.0s;
    -moz-animation-delay: 12.0s;
}
.slider ul  li:nth-child(4), .slider ul  li:nth-child(4) div {
    -webkit-animation-delay: 18.0s;
    -moz-animation-delay: 18.0s;
}

.slider ul li a {
    text-decoration: none;
 color: #fff;
}

.slider ul li p {
 color: #fff;
 font-size: 12px;
 margin-top: -12px;
 padding: 0 15px;
 filter: alpha(opacity=80);
    -moz-opacity: 0.8;
 -khtml-opacity: 0.8;
    opacity: 0.8;
}

.slider ul li  img a {
    display: block;
    float: left;
    width: 100%;
}

@-webkit-keyframes captions {
    0% {
        top: 100%;
        opacity: 0;
    }
    5% {
        top: 80%;
        opacity: 1;
    }
    20% {
        top: 80%;
        opacity: 1;
    }
    25% {
        top: 100%;
        opacity: 0;
    }
    100% {
        top: 100%;
        opacity: 0;
    }
}

@-moz-keyframes captions {
    0% {
        top: 100%;
        opacity: 0;
    }
    5% {
        top: 80%;
        opacity: 1;
    }
    20% {
        top: 80%;
        opacity: 1;
    }
    25% {
        top: 100%;
        opacity: 0;
    }
    100% {
        top: 100%;
        opacity: 0;
    }
}

.slider h3 {
 text-transform: uppercase;
 color: #fff;
 font-size: 14px;
 line-height: 14px;
        margin-top: 0;
 padding: 10px 15px 0;
 filter: alpha(opacity=80);
        -moz-opacity: 0.8;
 -khtml-opacity: 0.8;
        opacity: 0.8;
}

.slider ul li div {
 text-align: center;
    color: #fff;
    background-color: rgba(45, 44, 44, 0.7);
    background: rgba(45, 44, 44, 0.7);
    margin: 0; 
    padding: 0;
    position: absolute;
    bottom: 0;
    width: 500px;
    z-index :999;

    -webkit-animation-name: captions;
    -webkit-animation-duration: 24.0s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: normal;
    -webkit-animation-delay: 0;
    -webkit-animation-play-state: running;
    -webkit-animation-fill-mode: forwards;
  
    -moz-animation-name: captions;
    -moz-animation-duration: 24.0s;
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;
    -moz-animation-direction: normal;
    -moz-animation-delay: 0;
    -moz-animation-play-state: running;
    -moz-animation-fill-mode: forwards;
}
&lt;/style&gt;

&lt;div class=&quot;slider-container&quot;&gt;
 &lt;div class=&quot;slider&quot;&gt;
    &lt;ul&gt; 
     &lt;li&gt; 
      
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRnFuvANoyWcOTB8zKQknUb7Or7m5KgxBMcAKXO54YIs4WyDwr2LnkZbQhJv8EbEJHbE9lmlevKtDdenbVODlWCsy_XgcgX4HuY_OXW2ItYZiwnrCyzoc-VvP9QP0syH3xJ64_Xwzc3Y4/s1600/1.jpg&quot; imageanchor=&quot;1&quot; &gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRnFuvANoyWcOTB8zKQknUb7Or7m5KgxBMcAKXO54YIs4WyDwr2LnkZbQhJv8EbEJHbE9lmlevKtDdenbVODlWCsy_XgcgX4HuY_OXW2ItYZiwnrCyzoc-VvP9QP0syH3xJ64_Xwzc3Y4/s1600/1.jpg&quot; alt=&quot;Cara Membuat Images Slider Tanpa Jquery&quot; /&gt;&lt;/a&gt;

      &lt;div&gt; 
       &lt;h3&gt;Title #1&lt;/h3&gt; 
    &lt;p&gt;Content Text...&lt;/p&gt; 
   &lt;/div&gt;
  &lt;/li&gt; 
  &lt;li&gt; 
      
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwh31BDxwfzTt4lYDrDwB7Rc5eNyXEB8BZ3ES3W_Jk2kTmMoJlhwy1xzI7egH-1V90Pea_b787jDaFOgBE2edEI-hWCaevYQFM6ceyWXgVkrHMEoP8kabCUS_BhZzNPc7SssoGEgzXWaE/s1600/2.jpg&quot; imageanchor=&quot;1&quot; &gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwh31BDxwfzTt4lYDrDwB7Rc5eNyXEB8BZ3ES3W_Jk2kTmMoJlhwy1xzI7egH-1V90Pea_b787jDaFOgBE2edEI-hWCaevYQFM6ceyWXgVkrHMEoP8kabCUS_BhZzNPc7SssoGEgzXWaE/s1600/2.jpg&quot; alt=&quot;Cara Membuat Images Slider Tanpa Jquery&quot; /&gt;&lt;/a&gt;
   
      &lt;div&gt; 
       &lt;h3&gt;Title #2&lt;/h3&gt; 
       &lt;p&gt;Content Text...&lt;/p&gt; 
   &lt;/div&gt; 
  &lt;/li&gt; 
  &lt;li&gt; 
      
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRQC9Ct3aAs8P7Trf_ma5ssYVx5L_bzkSwGkRPDHpqKZdsZdd5Ce5u4ykOjfy0e5MIjH5oaES-w43X7qdLqA4jdfqDQ2MHQSgpRFDi7ANLDSV07vxdy41LJEHUmY1wTDvgF9AdF4nnRIM/s1600/3.jpg&quot; imageanchor=&quot;1&quot; &gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRQC9Ct3aAs8P7Trf_ma5ssYVx5L_bzkSwGkRPDHpqKZdsZdd5Ce5u4ykOjfy0e5MIjH5oaES-w43X7qdLqA4jdfqDQ2MHQSgpRFDi7ANLDSV07vxdy41LJEHUmY1wTDvgF9AdF4nnRIM/s1600/3.jpg&quot; alt=&quot;Cara Membuat Images Slider Tanpa Jquery&quot; /&gt;&lt;/a&gt;

   &lt;div&gt; 
       &lt;h3&gt;Title #3&lt;/h3&gt; 
    &lt;p&gt;Content Text...&lt;/p&gt; 
   &lt;/div&gt; 
  &lt;/li&gt; 
  &lt;li&gt; 
   
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjq6b7wtZBownDSCDPDxvRWeq0RfGDUfQYTNVVeqg-X8lNUElQbUrdNWsuAsVh4ldkabqlV7uBslrMQbGFPAqM-l3jtfjkPvhhSuF741-B2tGUjwKf8xDaV5gzET7zqR9aNT8OQ8AmDTpA/s1600/4.jpg&quot; imageanchor=&quot;1&quot; &gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjq6b7wtZBownDSCDPDxvRWeq0RfGDUfQYTNVVeqg-X8lNUElQbUrdNWsuAsVh4ldkabqlV7uBslrMQbGFPAqM-l3jtfjkPvhhSuF741-B2tGUjwKf8xDaV5gzET7zqR9aNT8OQ8AmDTpA/s1600/4.jpg&quot; alt=&quot;Cara Membuat Images Slider Tanpa Jquery&quot; /&gt;&lt;/a&gt;

      &lt;div&gt; 
       &lt;h3&gt;Title #4&lt;/h3&gt; 
       &lt;p&gt;Content Text...&lt;/p&gt; 
   &lt;/div&gt; 
  &lt;/li&gt; 
      
 &lt;/ul&gt; 
 &lt;/div&gt;  
&lt;/div&gt;

&lt;br /&gt;&lt;br /&gt;

  &lt;div style=&quot;border-top:#000 dotted 1px;&quot;&gt;&amp;nbsp;&lt;/div&gt;

  &lt;br /&gt;
  
&lt;div style=&quot;margin-bottom: 10px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;&lt;i&gt;&lt;u&gt;Silahkan Download Slidernya Pada Link di bawah ini:&lt;/u&gt;&lt;/i&gt;&lt;/b&gt;&lt;/span&gt;
&lt;/div&gt;

&lt;div style=&quot;text-align:justify;&quot;&gt;
&lt;a href=&quot;http://adf.ly/yAQYS&quot; target=&quot;_blank&quot;&gt;Slider 4 Gambar&lt;/a&gt; &lt;span style=&quot;color:red;font-size:14px;font-weight:bold;&quot;&gt;|&lt;/span&gt;
&lt;a href=&quot;http://adf.ly/yAQhG&quot; target=&quot;_blank&quot;&gt;Slider 5 Gambar&lt;/a&gt; &lt;span style=&quot;color:red;font-size:14px;font-weight:bold;&quot;&gt;|&lt;/span&gt;
&lt;a href=&quot;http://adf.ly/yAQrz&quot; target=&quot;_blank&quot;&gt;Slider 6 Gambar&lt;/a&gt; &lt;span style=&quot;color:red;font-size:14px;font-weight:bold;&quot;&gt;|&lt;/span&gt;
&lt;a href=&quot;http://adf.ly/yAR3i&quot; target=&quot;_blank&quot;&gt;Slider 7 Gambar&lt;/a&gt; &lt;span style=&quot;color:red;font-size:14px;font-weight:bold;&quot;&gt;|&lt;/span&gt;
&lt;a href=&quot;http://adf.ly/yARGB&quot; target=&quot;_blank&quot;&gt;Slider 8 Gambar&lt;/a&gt; &lt;span style=&quot;color:red;font-size:14px;font-weight:bold;&quot;&gt;|&lt;/span&gt;
&lt;a href=&quot;http://adf.ly/yARRg&quot; target=&quot;_blank&quot;&gt;Slider 9 Gambar&lt;/a&gt; &lt;span style=&quot;color:red;font-size:14px;font-weight:bold;&quot;&gt;|&lt;/span&gt;
&lt;a href=&quot;http://adf.ly/yARcT&quot; target=&quot;_blank&quot;&gt;Slider 10 Gambar&lt;/a&gt; &lt;span style=&quot;color:red;font-size:14px;font-weight:bold;&quot;&gt;|&lt;/span&gt;
&lt;a href=&quot;http://adf.ly/yARn2&quot; target=&quot;_blank&quot;&gt;Slider 11 Gambar&lt;/a&gt; &lt;span style=&quot;color:red;font-size:14px;font-weight:bold;&quot;&gt;|&lt;/span&gt;
&lt;a href=&quot;http://adf.ly/yARyQ&quot; target=&quot;_blank&quot;&gt;Slider 12 Gambar&lt;/a&gt; &lt;span style=&quot;color:red;font-size:14px;font-weight:bold;&quot;&gt;|&lt;/span&gt;
&lt;a href=&quot;http://adf.ly/yASAc&quot; target=&quot;_blank&quot;&gt;Slider 13 Gambar&lt;/a&gt; &lt;span style=&quot;color:red;font-size:14px;font-weight:bold;&quot;&gt;|&lt;/span&gt;
&lt;a href=&quot;http://adf.ly/yASOh&quot; target=&quot;_blank&quot;&gt;Slider 14 Gambar&lt;/a&gt; &lt;span style=&quot;color:red;font-size:14px;font-weight:bold;&quot;&gt;|&lt;/span&gt;
&lt;a href=&quot;http://adf.ly/yASVB&quot; target=&quot;_blank&quot;&gt;Slider 15 Gambar&lt;/a&gt; &lt;span style=&quot;color:red;font-size:14px;font-weight:bold;&quot;&gt;|&lt;/span&gt;
&lt;a href=&quot;http://adf.ly/yASdw&quot; target=&quot;_blank&quot;&gt;Slider 16 Gambar&lt;/a&gt; &lt;span style=&quot;color:red;font-size:14px;font-weight:bold;&quot;&gt;|&lt;/span&gt;
&lt;a href=&quot;http://adf.ly/yASkq&quot; target=&quot;_blank&quot;&gt;Slider 17 Gambar&lt;/a&gt; &lt;span style=&quot;color:red;font-size:14px;font-weight:bold;&quot;&gt;|&lt;/span&gt;
&lt;a href=&quot;http://adf.ly/yASpI&quot; target=&quot;_blank&quot;&gt;Slider 18 Gambar&lt;/a&gt; &lt;span style=&quot;color:red;font-size:14px;font-weight:bold;&quot;&gt;|&lt;/span&gt;
&lt;a href=&quot;http://adf.ly/yASxP&quot; target=&quot;_blank&quot;&gt;Slider 19 Gambar&lt;/a&gt; &lt;span style=&quot;color:red;font-size:14px;font-weight:bold;&quot;&gt;|&lt;/span&gt;
&lt;a href=&quot;http://adf.ly/yAT83&quot; target=&quot;_blank&quot;&gt;Slider 20 Gambar&lt;/a&gt;
&lt;/div&gt;
  

&lt;/div&gt; 
&lt;/ol&gt;

&lt;br /&gt;

&lt;p style=&quot;text-align:justify;margin:15px;border-top:#000 solid 1px;&quot;&gt;&lt;blink&gt;&lt;span style=&quot;color:red;&quot;&gt;&lt;b&gt;Nb.&lt;/b&gt;&lt;/span&gt;&lt;/blink&gt; Apabila artikel ini bermanfaat bagi Anda, silahkan bagikan dan beri &lt;i&gt;feed back&lt;/i&gt; pada kotak komentar di bawah. Terima Kasih!&lt;/p&gt;
 
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;</description><link>http://amirabella-zone.blogspot.com/2015/02/cara-membuat-images-slider-tanpa-jquery.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_QwjOhpNnx7iF1i2O7jFMu6t6Y_FnzLN5bplwEirj1LaBZ8h6NXmriHrG_13Tuv-ZLONmViNc0f1tHZLpVVSC9DtzK1W8dgJZKz-bO5eqzkWalfa8zXnnOYlHpz97WnsXRphhUfexyx8/s72-c/CSS3-Slider.jpg" height="72" width="72"/><thr:total>0</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-3026313752608427504</guid><pubDate>Sat, 31 Jan 2015 11:55:00 +0000</pubDate><atom:updated>2015-01-31T20:52:14.854+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">HTML</category><title>Cara Memasukkan Playlist Lagu Pada Dokumen HTML</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIP-x86F0roRUErJg7IpuSfx06XT_rnXlZ-XamAKK_85DoWhD2Zw2w72B1Kf7n7-I-OGZh7JeWviUU-n-4aHh_fyH4IUzSps2vIk97U4041Ll0bwp9YDVwvKymaJzT41zQuoRdRQmOnIY/s1600/Playlist-Lagu.jpg&quot; imageanchor=&quot;1&quot; style=&quot;clear: left; float: left; margin-bottom: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIP-x86F0roRUErJg7IpuSfx06XT_rnXlZ-XamAKK_85DoWhD2Zw2w72B1Kf7n7-I-OGZh7JeWviUU-n-4aHh_fyH4IUzSps2vIk97U4041Ll0bwp9YDVwvKymaJzT41zQuoRdRQmOnIY/s1600/Playlist-Lagu.jpg&quot; alt=&quot;Cara Memasukkan Playlist Lagu Pada Dokumen HTML&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Pada posting sebelumnya saya share &lt;a href=&quot;http://www.amirabella-zone.blogspot.com/2015/01/cara-membuat-efek-hujan-salju-pada.html&quot; target=&quot;_blank&quot;&gt;&lt;i&gt;&amp;#39;Cara Membuat Efek Hujan Salju Pada Dokumen HTML&amp;#39;&lt;/i&gt;&lt;/a&gt;, sekarang saya lanjutkan dengan share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2015/01/cara-memasukkan-playlist-lagu-pada.html&quot;&gt;&lt;i&gt;&amp;#39;Cara Memasukkan Playlist Lagu Pada Dokumen HTML&amp;#39;&lt;/i&gt;&lt;/a&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;Playlist Lagu&lt;/b&gt; adalah salah satu hal yang membuat halaman &lt;i&gt;web&lt;/i&gt; terkesan lebih menarik, dengan lantunan lagu-lagu favorit apalagi jika lagu yang diputar sesuai dengan suasana hati pengunjung tentu saja dapat membuatnya lebih betah dalam membaca artikel pada &lt;i&gt;website&lt;/i&gt; tersebut, karena tanpa lagu bagaikan kopi tanpa gula.. Begitu kira-kira. Hehe.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Baca juga: &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/03/cara-membuat-images-slideshow-pada.html&quot; target=&quot;_blank&quot;&gt;Cara Membuat Images Slideshow Pada Dokumen HTML&lt;/a&gt;
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Sebelumnya saya juga pernah share cara memasukkan lagu pada dokumen &lt;i&gt;HTML&lt;/i&gt; &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/cara-memasukkan-lagu-pada-dokumen-html.html&quot; target=&quot;_blank&quot;&gt;di sini&lt;/a&gt;. Jika pada cara sebelumnya hanya dapat memasukkan satu buah lagu saja, kali ini saya share bagaimana cara memasukkan lebih dari satu lagu yang disajikan dalam sebuah playlist.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Baiklah berikut ini cara membuat &lt;b&gt;&lt;i&gt;Playlist Lagu&lt;/i&gt;&lt;/b&gt; pada sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;.
&lt;/p&gt;

&lt;br /&gt;

&lt;div&gt;
&lt;div style=&quot;margin-bottom: 10px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;&lt;u&gt;Langkah-langkah:&lt;/u&gt;&lt;/b&gt;&lt;/span&gt;
&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;&quot;&gt;
&lt;div&gt;

&lt;p style=&quot;text-align:justify;margin:15px&quot;&gt;&lt;b&gt;&lt;u&gt;Cara Memasukkan Playlist Lagu Pada Dokumen HTML:&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;

&lt;ol style=&quot;margin-right:15px;&quot;&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;Jalankan aplikasi &lt;i&gt;text editor&lt;/i&gt; seperti &lt;i&gt;&amp;#39;notepad&amp;#39;&lt;/i&gt; untuk menulis sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;. Mungkin &lt;i&gt;notepad&lt;/i&gt; bawaan &lt;i&gt;windows&lt;/i&gt; kurang begitu menarik, solusinya Anda dapat menggunakan aplikasi &lt;i&gt;notepad++&lt;/i&gt; yang dapat Anda download di &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-notepad-63.html&quot; target=&quot;_blank&quot;&gt;sini&lt;/a&gt;.&lt;/li&gt;
 &lt;br /&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;&lt;b&gt;&lt;i&gt;Penting!&lt;/i&gt;&lt;/b&gt; simpan dokumen &lt;i&gt;HTML&lt;/i&gt; dengan format &lt;b&gt;&lt;i&gt;&amp;#39;Nama_File.html&amp;#39;&lt;/i&gt;&lt;/b&gt; tanpa tanda kutip, kemudian pada &lt;i&gt;&amp;#39;Save as type&amp;#39;&lt;/i&gt; Anda pilih &lt;i&gt;&amp;#39;All files&amp;#39;&lt;/i&gt; agar dokumen yang Anda simpan menjadi dokumen &lt;i&gt;HTML&lt;/i&gt; bukan dokumen &lt;i&gt;text biasa&lt;/i&gt;.&lt;/li&gt; 
 &lt;br /&gt; 
 &lt;li style=&quot;text-align:justify&quot;&gt;Sekarang mari kita mulai untuk membuat &lt;i&gt;playlist lagu&lt;/i&gt; pada dokumen &lt;i&gt;HTML&lt;/i&gt; seperti pada kotak di bawah ini.&lt;/li&gt;
 
 &lt;br /&gt;
 
 &lt;div style=&quot;margin-bottom: 10px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;&lt;i&gt;&lt;u&gt;Script Code:&lt;/u&gt;&lt;/i&gt;&lt;/b&gt;&lt;/span&gt;
&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;&quot;&gt;
&lt;div&gt;

  &lt;span style=&quot;color:#f83ab8;&quot;&gt;&amp;lt;!DOCTYPE html&amp;gt;&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;span style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;html&amp;gt;&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;span style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;head&amp;gt;&lt;/span&gt;&lt;br /&gt;
  &lt;span style=&quot;color:#59fa38;&quot;&gt;&amp;lt;title&amp;gt;&lt;/span&gt; Cara Memasukkan Playlist Lagu Pada Dokumen HTML &lt;span style=&quot;color:#59fa38;&quot;&gt;&amp;lt;/title&amp;gt;&lt;/span&gt;&lt;br /&gt;
  &lt;span style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;/head&amp;gt;&lt;/span&gt;&lt;br /&gt;&lt;br /&gt;

  &lt;span style=&quot;color:#FF6600;&quot;&gt;&amp;lt;body&amp;gt;&lt;/span&gt;&lt;br /&gt;
  &lt;br /&gt;
  &lt;span style=&quot;color:#de18ea;&quot;&gt;&amp;lt;!-- Begin Sound Script --&amp;gt;&lt;/span&gt;&lt;br /&gt;
  &lt;br /&gt;
  &amp;lt;embed allowscriptaccess=&amp;quot;never&amp;quot; src=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;player/player.swf&lt;/span&gt;&amp;quot; menu=&amp;quot;false&amp;quot; quality=&amp;quot;high&amp;quot; width=&amp;quot;265&amp;quot; height=&amp;quot;265&amp;quot; name=&amp;quot;index&amp;quot; type=&amp;quot;application/x-shockwave-flash&amp;quot; pluginspage=&amp;quot;http://www.macromedia.com/go/getflashplayer&amp;quot; flashvars=&amp;quot;playList=&lt;span style=&quot;color:red;background:yellow;&quot;&gt;playlist/playlist.xml&lt;/span&gt;&amp;quot; wmode=&amp;quot;transparent&amp;quot;&amp;gt;&amp;lt;/embed&amp;gt;&lt;br /&gt;
  &lt;br /&gt;
  &lt;span style=&quot;color:#de18ea;&quot;&gt;&amp;lt;!-- // End Sound Script --&amp;gt;&lt;/span&gt;&lt;br /&gt;
  &lt;br /&gt;
    
  &lt;span style=&quot;color:#FF6600;&quot;&gt;&amp;lt;/body&amp;gt;&lt;/span&gt;&lt;br /&gt;
  &lt;span style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;/html&amp;gt;&lt;/span&gt;&lt;br /&gt;
  &lt;br /&gt;

  &lt;div style=&quot;border-top:#000 dotted 1px;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;br /&gt; 
 
&lt;div&gt;
&lt;div style=&quot;margin-bottom: 5px;&quot;&gt;
&lt;span style=&quot;font-size: large; font-weight:bold;&quot;&gt;Script Playlist:&lt;/span&gt;
&lt;input value=&quot;Buka&quot; type=&quot;button&quot; onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot;&gt;&lt;/div&gt;
&lt;div style=&quot;margin: 0px; padding: 10px; border: 1px inset;&quot;&gt;
&lt;div style=&quot;display: none; overflow:hidden;&quot;&gt;

&amp;lt;?xml version=&amp;quot;1.0&amp;quot; encoding=&amp;quot;UTF-8&amp;quot;?&amp;gt;&lt;br /&gt;
&amp;lt;player showDisplay=&amp;quot;yes&amp;quot; showPlaylist=&amp;quot;yes&amp;quot; autoStart=&amp;quot;random&amp;quot;&amp;gt;&lt;br /&gt;
&amp;lt;song path=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Url File Lagu&lt;/span&gt;&amp;quot; title=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Judul Lagu&lt;/span&gt;&amp;quot; /&amp;gt;&lt;br /&gt;
&amp;lt;/player&amp;gt;

&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt; 

&lt;br /&gt;

&lt;div&gt;
&lt;div style=&quot;margin-bottom: 5px;&quot;&gt;
&lt;span style=&quot;font-size: large; font-weight:bold;&quot;&gt;Screenshot:&lt;/span&gt;
&lt;input value=&quot;Buka&quot; type=&quot;button&quot; onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot;&gt;&lt;/div&gt;
&lt;div style=&quot;margin: 0px; padding: 10px; border: 1px inset; text-align:center;&quot;&gt;
&lt;div style=&quot;display: none; overflow:hidden;&quot;&gt;

&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgv2mQ_Ws9Q_clakgr6VE_waPQj67UWM8X5E7T8_Ru2vtD7TMoyPtvYrdMv8ocVya5lDyJSdZ2sAWRBSKoq_jfP3fMa7_z7_a59-FCIx2waWFhMx2BmamNziuTYokWUpDUEcQDLVrox7W8/s1600/Musik-Player.png&quot; imageanchor=&quot;1&quot; style=&quot;margin-left: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgv2mQ_Ws9Q_clakgr6VE_waPQj67UWM8X5E7T8_Ru2vtD7TMoyPtvYrdMv8ocVya5lDyJSdZ2sAWRBSKoq_jfP3fMa7_z7_a59-FCIx2waWFhMx2BmamNziuTYokWUpDUEcQDLVrox7W8/s1600/Musik-Player.png&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt; 
  
  &lt;div style=&quot;background:#5E5E5E;color:white;text-align:center;font-weight:bold;margin:40px 0 0px 0;padding:5px;border:#000 solid 1px;&quot;&gt;
   Keterangan
   &lt;/div&gt;
  &lt;div style=&quot;background:#EFEFEF;border-left:#000 solid 1px;border-right:#000 solid 1px;border-bottom:#000 solid 1px; padding:10px 5px 0px 0px;&quot;&gt;
   
   &lt;ol&gt;
    &lt;li&gt;
     &lt;i&gt;Ganti &lt;span style=&quot;color:red;background:yellow;&quot;&gt;player/player.swf&lt;/span&gt; dengan Url tempat Anda menyimpan file music player. (File sudah disertakan pada link download di bawah)&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Ganti &lt;span style=&quot;color:red;background:yellow;&quot;&gt;playlist/playlist.xml&lt;/span&gt; dengan Url tempat Anda menyimpan file playlist. (File sudah disertakan pada link download di bawah)&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Buat file &lt;span style=&quot;color:red;background:yellow;&quot;&gt;playlist.xml&lt;/span&gt; yang merupakan file .xml yang berfungsi untuk mengkonfigurasi music player agar dapat berfungsi sebagaimana yang dikehendaki oleh Anda.&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Ganti &lt;span style=&quot;color:red;background:yellow;&quot;&gt;Url File Lagu&lt;/span&gt; dengan Url dimana Anda menyimpan file lagu, kemudian Ganti &lt;span style=&quot;color:red;background:yellow;&quot;&gt;Judul Lagu&lt;/span&gt; dengan judul lagu tersebut.&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Untuk menambah daftar lagu sisipkan kode &lt;span style=&quot;color:red;background:yellow;&quot;&gt;&amp;lt;song path=&amp;quot;Url File Lagu&amp;quot; title=&amp;quot;Judul Lagu&amp;quot; /&amp;gt;&lt;/span&gt; dan taruh di atas kode &lt;span style=&quot;color:red;background:yellow;&quot;&gt;&amp;lt;/player&amp;gt;&lt;/span&gt;. Silahkan Anda menyusun urutan lagu sesuai dengan yang Anda kehendaki.&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Simpan file playlist yang baru saja Anda buat dan beri nama file tersebut dengan &amp;#39;Playlist.xml&amp;#39; tanpa tanda kutip, atau dengan nama apa saja yang Anda kehendaki. Sebelum menyimpan pastikan &amp;#39;Save as type&amp;#39; Anda pilih &amp;#39;All files&amp;#39; agar dokumen yang Anda simpan menjadi dokumen &amp;#39;.xml&amp;#39; bukan dokumen text biasa.&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Silahkan download contoh musik player lengkap yang sudah jadi dengan cara klik link &amp;#39;Download Example Here&amp;#39; Di bawah ini.&lt;/i&gt;
    &lt;/li&gt;
   &lt;/ol&gt;
  &lt;div style=&quot;background:#5E5E5E;color:white;text-align:center;font-weight:bold;margin:0 -5px 0 0;padding:5px;border-top:#EFEFEF solid 1px;&quot;&gt;
   &lt;a href=&quot;http://adf.ly/x4Kor&quot; target=&quot;_blank&quot; style=&quot;color:white;text-decoration:none;outline:none;&quot;&gt;Download Example Here&lt;/a&gt;
   &lt;/div&gt;
  &lt;/div&gt;


&lt;/div&gt;
&lt;/div&gt;
 
&lt;/ol&gt;

&lt;br /&gt;

&lt;p style=&quot;text-align:justify;margin:15px;border-top:#000 solid 1px;&quot;&gt;&lt;blink&gt;&lt;span style=&quot;color:red;&quot;&gt;&lt;b&gt;Nb.&lt;/b&gt;&lt;/span&gt;&lt;/blink&gt; Apabila artikel ini bermanfaat bagi Anda, silahkan bagikan dan beri &lt;i&gt;feed back&lt;/i&gt; pada kotak komentar di bawah. Terima Kasih!&lt;/p&gt;
 
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;</description><link>http://amirabella-zone.blogspot.com/2015/01/cara-memasukkan-playlist-lagu-pada.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIP-x86F0roRUErJg7IpuSfx06XT_rnXlZ-XamAKK_85DoWhD2Zw2w72B1Kf7n7-I-OGZh7JeWviUU-n-4aHh_fyH4IUzSps2vIk97U4041Ll0bwp9YDVwvKymaJzT41zQuoRdRQmOnIY/s72-c/Playlist-Lagu.jpg" height="72" width="72"/><thr:total>0</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-2739797855560187562</guid><pubDate>Wed, 28 Jan 2015 22:06:00 +0000</pubDate><atom:updated>2015-01-29T07:09:29.080+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">HTML</category><title>Cara Membuat Efek Hujan Salju Pada Dokumen HTML</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbwYbFN0fKYp-PS-yEetLHSd12pZmBzjGGcAykInRI7L-GWE-uTEonOt71BX1Dsw6lU3LRGRDL-LTHbkGG8CuIXbypB2zhUuwPE4o3YYt25X0D8kBciZjzy44w_79JVSpxwtYJopTvCBw/s1600/Hujan-Salju.jpg&quot; imageanchor=&quot;1&quot; style=&quot;clear: left; float: left; margin-bottom: 1em; margin-right: 1em;&quot;&gt;&lt;img alt=&quot;Cara Membuat Efek Hujan Salju Pada Dokumen HTML&quot; border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbwYbFN0fKYp-PS-yEetLHSd12pZmBzjGGcAykInRI7L-GWE-uTEonOt71BX1Dsw6lU3LRGRDL-LTHbkGG8CuIXbypB2zhUuwPE4o3YYt25X0D8kBciZjzy44w_79JVSpxwtYJopTvCBw/s1600/Hujan-Salju.jpg&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Pada posting sebelumnya saya share &lt;a href=&quot;http://www.amirabella-zone.blogspot.com/2015/01/cara-membuat-spoiler-tombol-buka-tutup.html&quot; target=&quot;_blank&quot;&gt;&lt;i&gt;&#39;Cara Membuat Spoiler (Tombol Buka Tutup) Pada Dokumen HTML&#39;&lt;/i&gt;&lt;/a&gt;, sekarang saya lanjutkan dengan share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2015/01/cara-membuat-efek-hujan-salju-pada.html&quot;&gt;&lt;i&gt;&#39;Cara Membuat Efek Hujan Salju Pada Dokumen HTML&#39;&lt;/i&gt;&lt;/a&gt;.
&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
&lt;b&gt;Efek Hujan Salju&lt;/b&gt; merupakan sebuah efek yang mirip dengan hujan salju yang dapat mempercantik dan memberi kesan yang berbeda pada dokumen &lt;i&gt;html&lt;/i&gt; yang kita buat. Dengan menambahkan &lt;i&gt;javascript&lt;/i&gt; pada dokumen &lt;i&gt;html&lt;/i&gt; maka dokumen yang kita buat pun dapat seketika terlihat lebih menarik dengan adanya Efek Hujan Salju ini.
&lt;/div&gt;
&lt;div style=&quot;text-align: justify;&quot;&gt;
Baiklah berikut ini cara membuat &lt;b&gt;&lt;i&gt;Efek Hujan Salju&lt;/i&gt;&lt;/b&gt; pada sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;.
&lt;/div&gt;
&lt;br /&gt;
&lt;div&gt;
&lt;div style=&quot;margin-bottom: 10px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;&lt;u&gt;Langkah-langkah:&lt;/u&gt;&lt;/b&gt;&lt;/span&gt;
&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; -webkit-border-radius: 5px; border: 1px inset; border: 1px inset; margin: 0px; margin: 0px; padding: 10px; padding: 10px;&quot;&gt;
&lt;div&gt;
&lt;div style=&quot;margin: 15px; text-align: justify;&quot;&gt;
&lt;b&gt;&lt;u&gt;Cara Membuat Efek Hujan Salju Pada Dokumen HTML:&lt;/u&gt;&lt;/b&gt;&lt;/div&gt;
&lt;ol style=&quot;margin-right: 15px;&quot;&gt;
&lt;li style=&quot;text-align: justify;&quot;&gt;Jalankan aplikasi &lt;i&gt;text editor&lt;/i&gt; seperti &lt;i&gt;&#39;notepad&#39;&lt;/i&gt; untuk menulis sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;. Mungkin &lt;i&gt;notepad&lt;/i&gt; bawaan &lt;i&gt;windows&lt;/i&gt; kurang begitu menarik, solusinya Anda dapat menggunakan aplikasi &lt;i&gt;notepad++&lt;/i&gt; yang dapat Anda download di &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-notepad-63.html&quot; target=&quot;_blank&quot;&gt;sini&lt;/a&gt;.&lt;/li&gt;
&lt;br /&gt;
&lt;li style=&quot;text-align: justify;&quot;&gt;&lt;b&gt;&lt;i&gt;Penting!&lt;/i&gt;&lt;/b&gt; simpan dokumen &lt;i&gt;HTML&lt;/i&gt; dengan format &lt;b&gt;&lt;i&gt;&#39;Nama_File.html&#39;&lt;/i&gt;&lt;/b&gt; tanpa tanda kutip, kemudian pada &lt;i&gt;&#39;Save as type&#39;&lt;/i&gt; Anda pilih &lt;i&gt;&#39;All files&#39;&lt;/i&gt; agar dokumen yang Anda simpan menjadi dokumen &lt;i&gt;HTML&lt;/i&gt; bukan dokumen &lt;i&gt;text biasa&lt;/i&gt;.&lt;/li&gt;
&lt;br /&gt;
&lt;li style=&quot;text-align: justify;&quot;&gt;Sekarang mari kita mulai untuk membuat &lt;i&gt;Hujan Salju&lt;/i&gt; pada dokumen &lt;i&gt;HTML&lt;/i&gt; seperti pada kotak di bawah ini.&lt;/li&gt;
&lt;br /&gt;
 
 &lt;div style=&quot;margin-bottom: 10px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;&lt;i&gt;&lt;u&gt;Script Code:&lt;/u&gt;&lt;/i&gt;&lt;/b&gt;&lt;/span&gt;
&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; -webkit-border-radius: 5px; border: 1px inset; border: 1px inset; margin: 0px; margin: 0px; padding: 15px; padding: 15px;&quot;&gt;
&lt;div&gt;
&lt;span style=&quot;color: #f83ab8;&quot;&gt;&amp;lt;!DOCTYPE html&amp;gt;&lt;/span&gt;&lt;br /&gt;
&lt;br /&gt;
&lt;span style=&quot;color: #3abcf8;&quot;&gt;&amp;lt;html&amp;gt;&lt;/span&gt;&lt;br /&gt;
&lt;br /&gt;
&lt;span style=&quot;color: #cc33ff;&quot;&gt;&amp;lt;head&amp;gt;&lt;/span&gt;&lt;br /&gt;
&lt;span style=&quot;color: #59fa38;&quot;&gt;&amp;lt;title&amp;gt;&lt;/span&gt; Cara Membuat Efek Hujan Salju Pada Dokumen HTML &lt;span style=&quot;color: #59fa38;&quot;&gt;&amp;lt;/title&amp;gt;&lt;/span&gt;&lt;br /&gt;
&lt;br /&gt;
&amp;lt;script src=&#39;&lt;span style=&quot;background: yellow; color: red;&quot;&gt;js/snowstorm.js&lt;/span&gt;&#39; type=&#39;text/javascript&#39;&amp;gt;&amp;lt;/script&amp;gt;&lt;br /&gt;
&lt;br /&gt;
&lt;span style=&quot;color: #cc33ff;&quot;&gt;&amp;lt;/head&amp;gt;&lt;/span&gt;&lt;br /&gt;
&lt;br /&gt;
&lt;span style=&quot;color: #ff6600;&quot;&gt;&amp;lt;body&amp;gt;&lt;/span&gt;&lt;br /&gt;
&lt;span style=&quot;color: #ff6600;&quot;&gt;&amp;lt;/body&amp;gt;&lt;/span&gt;&lt;br /&gt;
&lt;span style=&quot;color: #3abcf8;&quot;&gt;&amp;lt;/html&amp;gt;&lt;/span&gt;&lt;br /&gt;
&lt;br /&gt;
&lt;div style=&quot;border-top: #000 dotted 1px;&quot;&gt;
&lt;/div&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;div&gt;
&lt;div style=&quot;margin-bottom: 5px;&quot;&gt;
&lt;span style=&quot;font-size: large; font-weight: bold;&quot;&gt;Ilustrasi Efek Hujan Salju:&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;border: 1px inset; margin: 0px; padding: 10px;&quot;&gt;
&lt;div style=&quot;text-align:center;display: none; overflow: hidden;&quot;&gt;

&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4ECfeXLDNshM-jsYZHscTD-023NMAhtwsKgQtqn_OLLW6y8DitEj-2d7hQxLti-78kHNIh4KIEPzuOdRDhTKxeDQ6vSc1WMpsOcwsyIWiHD-pHy4r5A8EqWjEIDD0Oii8ZR7ZSm6tEHw/s1600/Snowstorm.gif&quot; imageanchor=&quot;1&quot;&gt;&lt;img alt=&quot;Cara Membuat Efek Hujan Salju Pada Dokumen HTML&quot; border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4ECfeXLDNshM-jsYZHscTD-023NMAhtwsKgQtqn_OLLW6y8DitEj-2d7hQxLti-78kHNIh4KIEPzuOdRDhTKxeDQ6vSc1WMpsOcwsyIWiHD-pHy4r5A8EqWjEIDD0Oii8ZR7ZSm6tEHw/s1600/Snowstorm.gif&quot; style=&quot;border: 0px;&quot; /&gt;&lt;/a&gt;

&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div style=&quot;background: #5E5E5E; border: #000 solid 1px; color: white; font-weight: bold; margin: 40px 0 0px 0; padding: 5px; text-align: center;&quot;&gt;
Keterangan
   &lt;/div&gt;
&lt;div style=&quot;background: #EFEFEF; border-bottom: #000 solid 1px; border-left: #000 solid 1px; border-right: #000 solid 1px; padding: 10px 5px 0px 0px;&quot;&gt;
&lt;ol&gt;
&lt;li&gt;
     &lt;i&gt;Sisipkan kode &#39;&amp;lt;script src=&#39;&lt;span style=&quot;background: yellow; color: red;&quot;&gt;js/snowstorm.js&lt;/span&gt;&#39; type=&#39;text/javascript&#39;&amp;gt;&amp;lt;/script&amp;gt;&#39; tepat di atas kode &lt;span style=&quot;color: #cc33ff;&quot;&gt;&amp;lt;/head&amp;gt;&lt;/span&gt; seperti pada contoh di atas.&lt;/i&gt;
    &lt;/li&gt;
&lt;li&gt;
     &lt;i&gt;Ganti &lt;span style=&quot;background: yellow; color: red;&quot;&gt;js/snowstorm.js&lt;/span&gt; sesuai dengan Url javascript efek hujan salju Anda. (Sudah disertakan di dalam file download di bawah).&lt;/i&gt;
    &lt;/li&gt;
&lt;li&gt;
     &lt;i&gt;Silahkan download contoh cara membuat Efek Hujan Salju dalam bentuk file HTML dengan cara klik Link &#39;Download Example Here&#39; Di bawah ini.&lt;/i&gt;
    &lt;/li&gt;
&lt;/ol&gt;
&lt;div style=&quot;background: #5E5E5E; border-top: #EFEFEF solid 1px; color: white; font-weight: bold; margin: 0 -5px 0 0; padding: 5px; text-align: center;&quot;&gt;
&lt;a href=&quot;http://adf.ly/wlHPI&quot; style=&quot;color: white; outline: none; text-decoration: none;&quot; target=&quot;_blank&quot;&gt;Download Example Here&lt;/a&gt;
   &lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/ol&gt;
&lt;br /&gt;
&lt;div style=&quot;border-top: #000 solid 1px; margin: 15px; text-align: justify;&quot;&gt;
&lt;blink&gt;&lt;span style=&quot;color: red;&quot;&gt;&lt;b&gt;Nb.&lt;/b&gt;&lt;/span&gt;&lt;/blink&gt; Apabila artikel ini bermanfaat bagi Anda, silahkan bagikan dan beri &lt;i&gt;feed back&lt;/i&gt; pada kotak komentar di bawah. Terima Kasih!&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
</description><link>http://amirabella-zone.blogspot.com/2015/01/cara-membuat-efek-hujan-salju-pada.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbwYbFN0fKYp-PS-yEetLHSd12pZmBzjGGcAykInRI7L-GWE-uTEonOt71BX1Dsw6lU3LRGRDL-LTHbkGG8CuIXbypB2zhUuwPE4o3YYt25X0D8kBciZjzy44w_79JVSpxwtYJopTvCBw/s72-c/Hujan-Salju.jpg" height="72" width="72"/><thr:total>0</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-3692806561489176446</guid><pubDate>Wed, 28 Jan 2015 01:22:00 +0000</pubDate><atom:updated>2015-01-29T06:01:51.329+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">HTML</category><title>Cara Membuat Spoiler (Tombol Buka Tutup) Pada Dokumen HTML</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUkEUDJ2zZdXxa4YAmDZSvoA3U0KGw7tdCbuA5VoYJIBiqnnsluym_LEQkZSbUiMqSRJLjFFik3KolYJQsEfeE03D11nUiqgFylpKH0no2RkssxQYDNQJfB6pe7LcZaWyZRI2Rnk0jRCA/s1600/How+To+Make+Spoiler.jpg&quot; imageanchor=&quot;1&quot; style=&quot;clear: left; float: left; margin-bottom: 1em; margin-right: 1em;&quot;&gt;&lt;img alt=&quot;Cara Membuat Spoiler (Tombol Buka Tutup) Pada Dokumen HTML&quot; border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUkEUDJ2zZdXxa4YAmDZSvoA3U0KGw7tdCbuA5VoYJIBiqnnsluym_LEQkZSbUiMqSRJLjFFik3KolYJQsEfeE03D11nUiqgFylpKH0no2RkssxQYDNQJfB6pe7LcZaWyZRI2Rnk0jRCA/s1600/How+To+Make+Spoiler.jpg&quot; title=&quot;&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;p style=&quot;text-align: justify;&quot;&gt;
Pada posting sebelumnya saya share &lt;a href=&quot;http://www.amirabella-zone.blogspot.com/2013/03/cara-membuat-background-tetap-pada.html&quot; target=&quot;_blank&quot;&gt;&lt;i&gt;&#39;Cara Membuat Background Tetap Pada Dokumen HTML&#39;&lt;/i&gt;&lt;/a&gt;, sekarang saya lanjutkan dengan share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2015/01/cara-membuat-spoiler-tombol-buka-tutup.html&quot;&gt;&lt;i&gt;&#39;Cara Membuat Spoiler (Tombol Buka Tutup) Pada Dokumen HTML&#39;&lt;/i&gt;&lt;/a&gt;.
&lt;/p&gt;
&lt;p style=&quot;text-align: justify;&quot;&gt;
&lt;b&gt;Spoiler&lt;/b&gt; adalah sebuah konten yang secara &lt;i&gt;default&lt;/i&gt; disembunyikan di dalam sebuah &lt;i&gt;element&lt;/i&gt; dengan disertakan sebuah tombol untuk membuka dan menutup &lt;i&gt;element&lt;/i&gt; tersebut sehingga konten yang ada didalamnya dapat di lihat. Tujuan dari digunakannya &lt;i&gt;spoiler&lt;/i&gt; sangat beragam, mulai dari untuk membuat artikel supaya tidak terlihat terlalu panjang maupun untuk tujuan lainnya.
&lt;/p&gt;
&lt;p style=&quot;text-align: justify;&quot;&gt;
Baiklah berikut ini cara membuat &lt;b&gt;&lt;i&gt;Spoiler&lt;/i&gt;&lt;/b&gt; pada sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;.
&lt;/p&gt;
&lt;br /&gt;
&lt;div&gt;
&lt;div style=&quot;margin-bottom: 10px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;&lt;u&gt;Langkah-langkah:&lt;/u&gt;&lt;/b&gt;&lt;/span&gt;
&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; -webkit-border-radius: 5px; border: 1px inset; border: 1px inset; margin: 0px; margin: 0px; padding: 10px; padding: 10px;&quot;&gt;
&lt;div&gt;
&lt;div style=&quot;margin: 15px; text-align: justify;&quot;&gt;
&lt;b&gt;&lt;u&gt;Cara Membuat Spoiler Pada Dokumen HTML:&lt;/u&gt;&lt;/b&gt;&lt;/div&gt;
&lt;ol style=&quot;margin-right: 15px;&quot;&gt;
&lt;li style=&quot;text-align: justify;&quot;&gt;Jalankan aplikasi &lt;i&gt;text editor&lt;/i&gt; seperti &lt;i&gt;&#39;notepad&#39;&lt;/i&gt; untuk menulis sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;. Mungkin &lt;i&gt;notepad&lt;/i&gt; bawaan &lt;i&gt;windows&lt;/i&gt; kurang begitu menarik, solusinya Anda dapat menggunakan aplikasi &lt;i&gt;notepad++&lt;/i&gt; yang dapat Anda download di &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-notepad-63.html&quot; target=&quot;_blank&quot;&gt;sini&lt;/a&gt;.&lt;/li&gt;
&lt;br /&gt;
&lt;li style=&quot;text-align: justify;&quot;&gt;&lt;b&gt;&lt;i&gt;Penting!&lt;/i&gt;&lt;/b&gt; simpan dokumen &lt;i&gt;HTML&lt;/i&gt; dengan format &lt;b&gt;&lt;i&gt;&#39;Nama_File.html&#39;&lt;/i&gt;&lt;/b&gt; tanpa tanda kutip, kemudian pada &lt;i&gt;&#39;Save as type&#39;&lt;/i&gt; Anda pilih &lt;i&gt;&#39;All files&#39;&lt;/i&gt; agar dokumen yang Anda simpan menjadi dokumen &lt;i&gt;HTML&lt;/i&gt; bukan dokumen &lt;i&gt;text biasa&lt;/i&gt;.&lt;/li&gt;
&lt;br /&gt;
&lt;li style=&quot;text-align: justify;&quot;&gt;Sekarang mari kita mulai untuk membuat &lt;i&gt;Spoiler&lt;/i&gt; pada dokumen &lt;i&gt;HTML&lt;/i&gt; seperti pada kotak di bawah ini.&lt;/li&gt;
&lt;br /&gt;
 
 &lt;div style=&quot;margin-bottom: 10px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;&lt;i&gt;&lt;u&gt;Script Code:&lt;/u&gt;&lt;/i&gt;&lt;/b&gt;&lt;/span&gt;
&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; -webkit-border-radius: 5px; border: 1px inset; border: 1px inset; margin: 0px; margin: 0px; padding: 15px; padding: 15px;&quot;&gt;
&lt;div&gt;
&lt;span style=&quot;color: #f83ab8;&quot;&gt;&amp;lt;!DOCTYPE html&amp;gt;&lt;/span&gt;&lt;br /&gt;
&lt;br /&gt;
&lt;span style=&quot;color: #3abcf8;&quot;&gt;&amp;lt;html&amp;gt;&lt;/span&gt;&lt;br /&gt;
&lt;br /&gt;
&lt;span style=&quot;color: #cc33ff;&quot;&gt;&amp;lt;head&amp;gt;&lt;/span&gt;&lt;br /&gt;
&lt;span style=&quot;color: #59fa38;&quot;&gt;&amp;lt;title&amp;gt;&lt;/span&gt; Cara Membuat Spoiler Pada Dokumen HTML &lt;span style=&quot;color: #59fa38;&quot;&gt;&amp;lt;/title&amp;gt;&lt;/span&gt;&lt;br /&gt;
&lt;span style=&quot;color: #cc33ff;&quot;&gt;&amp;lt;/head&amp;gt;&lt;/span&gt;&lt;br /&gt;
&lt;br /&gt;
&lt;span style=&quot;color: #ff6600;&quot;&gt;&amp;lt;body&amp;gt;&lt;/span&gt;&lt;br /&gt;
&lt;blink&gt;&lt;span style=&quot;color: green;&quot;&gt;&amp;lt;!-- Awal Script Spoiler --&amp;gt;&amp;nbsp;&lt;/span&gt;&lt;/blink&gt;&lt;br /&gt;
  &amp;lt;div&amp;gt;&lt;br /&gt;
  &amp;lt;div style=&quot;margin-bottom: 5px;&quot;&amp;gt;&lt;br /&gt;
  &amp;lt;span style=&quot;font-size: large; font-weight:bold;&quot;&amp;gt;&lt;span style=&quot;background: yellow; color: red;&quot;&gt;Judul Spoiler:&lt;/span&gt;&amp;lt;/span&amp;gt;&lt;br /&gt;
  &amp;lt;input value=&quot;Buka&quot; type=&quot;button&quot; onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot;&amp;gt;&amp;lt;/div&amp;gt;&lt;br /&gt;
  &amp;lt;div style=&quot;margin: 0px; padding: 10px; border: 1px inset;&quot;&amp;gt;&lt;br /&gt;
  &amp;lt;div style=&quot;display: none;&quot;&amp;gt;&lt;br /&gt;
  &lt;br /&gt;
  &lt;span style=&quot;background: yellow; color: red;&quot;&gt;Letakan Konten Di Sini..!!&lt;/span&gt;&lt;br /&gt;
  &lt;br /&gt;
  &amp;lt;/div&amp;gt;&lt;br /&gt;
  &amp;lt;/div&amp;gt;&lt;br /&gt;
  &amp;lt;/div&amp;gt;&lt;br /&gt;
  &lt;blink&gt;&lt;span style=&quot;color: green;&quot;&gt;&amp;lt;!-- Akhir Script Spoiler --&amp;gt;&lt;/span&gt;&lt;/blink&gt;&lt;br /&gt;
  &lt;br /&gt;
&lt;span style=&quot;color: #ff6600;&quot;&gt;&amp;lt;/body&amp;gt;&lt;/span&gt;&lt;br /&gt;
&lt;span style=&quot;color: #3abcf8;&quot;&gt;&amp;lt;/html&amp;gt;&lt;/span&gt;&lt;br /&gt;
&lt;br /&gt;

&lt;div style=&quot;border-top:#000 dotted 1px;&quot;&gt;&amp;nbsp;&lt;/div&gt;
  &lt;br /&gt;

&lt;div&gt;
&lt;div style=&quot;margin-bottom: 5px;&quot;&gt;
&lt;span style=&quot;font-size: large; font-weight: bold;&quot;&gt;Contoh Spoiler:&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;border: 1px inset; margin: 0px; padding: 10px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;
&lt;p style=&quot;text-align: justify;&quot;&gt;
&lt;b&gt;Spoiler&lt;/b&gt; adalah sebuah konten yang secara &lt;i&gt;default&lt;/i&gt; disembunyikan di dalam sebuah &lt;i&gt;element&lt;/i&gt; dengan disertakan sebuah tombol untuk membuka dan menutup &lt;i&gt;element&lt;/i&gt; tersebut sehingga konten yang ada didalamnya dapat di lihat. Tujuan dari digunakannya &lt;i&gt;spoiler&lt;/i&gt; sangat beragam, mulai dari untuk membuat artikel supaya tidak terlihat terlalu panjang maupun untuk tujuan lainnya.&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;

&lt;div style=&quot;background: #5E5E5E; border: #000 solid 1px; color: white; font-weight: bold; margin: 40px 0 0px 0; padding: 5px; text-align: center;&quot;&gt;
Keterangan
   &lt;/div&gt;
&lt;div style=&quot;background: #EFEFEF; border-bottom: #000 solid 1px; border-left: #000 solid 1px; border-right: #000 solid 1px; padding: 10px 5px 0px 0px;&quot;&gt;
&lt;ol&gt;
&lt;li&gt;
     &lt;i&gt;Ganti &lt;span style=&quot;background: yellow; color: red;&quot;&gt;Judul Spoiler:&lt;/span&gt; sesuai dengan judul yang Anda kehendaki.&lt;/i&gt;
    &lt;/li&gt;
&lt;li&gt;
     &lt;i&gt;Letakan konten yang akan dimasukkan di dalam spoiler seperti sebuah paragraf maupun file gambar tepat pada kata &lt;span style=&quot;background: yellow; color: red;&quot;&gt;Letakan Konten Di Sini..!!&lt;/span&gt;.&lt;/i&gt;
    &lt;/li&gt;
&lt;li&gt;
     &lt;i&gt;Silahkan download contoh cara membuat spoiler (Tombol Buka Tutup) dalam bentuk file HTML pada Link Di bawah ini.&lt;/i&gt;
    &lt;/li&gt;
&lt;/ol&gt;
&lt;div style=&quot;background: #5E5E5E; border-top: #EFEFEF solid 1px; color: white; font-weight: bold; margin: 0 -5px 0 0; padding: 5px; text-align: center;&quot;&gt;
&lt;a href=&quot;http://adf.ly/wk2eb&quot; style=&quot;color: white; outline: none; text-decoration: none;&quot; target=&quot;_blank&quot;&gt;Download Example Here&lt;/a&gt;
   &lt;/div&gt;
&lt;/div&gt;

&lt;/div&gt;
&lt;/div&gt;
&lt;/ol&gt;
&lt;br /&gt;
&lt;div style=&quot;border-top: #000 solid 1px; margin: 15px; text-align: justify;&quot;&gt;
&lt;blink&gt;&lt;span style=&quot;color: red;&quot;&gt;&lt;b&gt;Nb.&lt;/b&gt;&lt;/span&gt;&lt;/blink&gt; Apabila artikel ini bermanfaat bagi Anda, silahkan bagikan dan beri &lt;i&gt;feed back&lt;/i&gt; pada kotak komentar di bawah. Terima Kasih!&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
</description><link>http://amirabella-zone.blogspot.com/2015/01/cara-membuat-spoiler-tombol-buka-tutup.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUkEUDJ2zZdXxa4YAmDZSvoA3U0KGw7tdCbuA5VoYJIBiqnnsluym_LEQkZSbUiMqSRJLjFFik3KolYJQsEfeE03D11nUiqgFylpKH0no2RkssxQYDNQJfB6pe7LcZaWyZRI2Rnk0jRCA/s72-c/How+To+Make+Spoiler.jpg" height="72" width="72"/><thr:total>0</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-2925254949523854293</guid><pubDate>Wed, 27 Mar 2013 00:22:00 +0000</pubDate><atom:updated>2015-01-31T23:48:20.633+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">HTML</category><title>Cara Membuat Background Tetap Pada Dokumen HTML</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimY7YJWX7JyJSAtPvcFDllNTCuOHhYp9S5-Y45E9s4b7rULWc-T5z0l5pTzKdh6LtYYnoHKsomgxKlfKcC48MHvaWAe7EjwzmbSWUV3jXMx3UFFkbsKNNztZQIJ70JjyJiZWnczrQsiog/s1600/Background-Tetap.jpg&quot; imageanchor=&quot;1&quot; style=&quot;clear: left; float: left; margin-bottom: 1em; margin-right: 1em;&quot;&gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimY7YJWX7JyJSAtPvcFDllNTCuOHhYp9S5-Y45E9s4b7rULWc-T5z0l5pTzKdh6LtYYnoHKsomgxKlfKcC48MHvaWAe7EjwzmbSWUV3jXMx3UFFkbsKNNztZQIJ70JjyJiZWnczrQsiog/s1600/Background-Tetap.jpg&quot; alt=&quot;Cara Membuat Background Tetap Pada Dokumen HTML&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Pada posting sebelumnya saya share &lt;a href=&quot;http://www.amirabella-zone.blogspot.com/2013/03/cara-memasang-cursor-pada-dokumen-html.html&quot;&gt;&lt;i&gt;&amp;#39;Cara Memasang Cursor Pada Dokumen HTML&amp;#39;&lt;/i&gt;&lt;/a&gt;, sekarang saya lanjutkan dengan share &lt;a href=&quot;http://www.amirabella-zone.blogspot.com/2013/03/cara-membuat-background-tetap-pada.html&quot;&gt;&lt;i&gt;&amp;#39;Cara Membuat Background Tetap Pada Dokumen HTML&amp;#39;&lt;/i&gt;&lt;/a&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;Background&lt;/b&gt; adalah sebuah latar belakang dari sebuah halaman. Jika dikaitkan dengan konteks &lt;i&gt;HTML&lt;/i&gt; maka background merupakan latar dari sebuah halaman &lt;i&gt;HTML&lt;/i&gt;. Tujuan dari pemasangan sebuah &lt;i&gt;background&lt;/i&gt; tentu saja untuk mempercantik tampilan dari dokumen &lt;i&gt;HTML&lt;/i&gt; yang kita buat. Lalu apa yang dimaksud dengan &lt;b&gt;Background Tetap&lt;/b&gt; &lt;i&gt;(Fixed Background)&lt;/i&gt;? Background Tetap yang dimaksud di sini adalah sebuah &lt;i&gt;image background&lt;/i&gt; yang posisinya selalu tetap pada screen atau layar &lt;i&gt;(tidak bergerak)&lt;/i&gt; meskipun halaman tersebut kita &lt;i&gt;scroll&lt;/i&gt; kebawah maupun sebaliknya.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Baca juga: &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/03/cara-membuat-images-slideshow-pada.html&quot; target=&quot;_blank&quot;&gt;Cara Membuat Images Slideshow Pada Dokumen HTML&lt;/a&gt;
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Baiklah berikut ini cara membuat &lt;b&gt;&lt;i&gt;Background Tetap&lt;/i&gt;&lt;/b&gt; pada sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;.
&lt;/p&gt;

&lt;br /&gt;

&lt;div&gt;
&lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;Langkah-langkah:&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

&lt;p style=&quot;text-align:justify;margin:15px&quot;&gt;&lt;b&gt;&lt;u&gt;Cara Membuat Background Tetap Pada Dokumen HTML:&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;

&lt;ol style=&quot;margin-right:15px;&quot;&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;Jalankan aplikasi &lt;i&gt;text editor&lt;/i&gt; seperti &lt;i&gt;&amp;#39;notepad&amp;#39;&lt;/i&gt; untuk menulis sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;. Mungkin &lt;i&gt;notepad&lt;/i&gt; bawaan &lt;i&gt;windows&lt;/i&gt; kurang begitu menarik, solusinya Anda dapat menggunakan aplikasi &lt;i&gt;notepad++&lt;/i&gt; yang dapat Anda download di &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-notepad-63.html&quot; target=&quot;_blank&quot;&gt;sini&lt;/a&gt;.&lt;/li&gt;
 &lt;br /&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;&lt;b&gt;&lt;i&gt;Penting!&lt;/i&gt;&lt;/b&gt; simpan dokumen &lt;i&gt;HTML&lt;/i&gt; dengan format &lt;b&gt;&lt;i&gt;&amp;#39;Nama_File.html&amp;#39;&lt;/i&gt;&lt;/b&gt; tanpa tanda kutip, kemudian pada &lt;i&gt;&amp;#39;Save as type&amp;#39;&lt;/i&gt; Anda pilih &lt;i&gt;&amp;#39;All files&amp;#39;&lt;/i&gt; agar dokumen yang Anda simpan menjadi dokumen &lt;i&gt;HTML&lt;/i&gt; bukan dokumen &lt;i&gt;text biasa&lt;/i&gt;.&lt;/li&gt; 
 &lt;br /&gt; 
 &lt;li style=&quot;text-align:justify&quot;&gt;Sekarang mari kita mulai untuk membuat &lt;i&gt;Background Tetap&lt;/i&gt; pada dokumen &lt;i&gt;HTML&lt;/i&gt; seperti pada kotak di bawah ini.&lt;/li&gt;
 
 &lt;br /&gt;
 
 &lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;&lt;i&gt;Script Code:&lt;/i&gt;&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

  &lt;font style=&quot;color:#f83ab8;&quot;&gt;&amp;lt;!DOCTYPE html&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;html&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;head&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#59fa38;&quot;&gt;&amp;lt;title&amp;gt;&lt;/font&gt; Cara Membuat Background Tetap Pada Dokumen HTML &lt;font style=&quot;color:#59fa38;&quot;&gt;&amp;lt;/title&amp;gt;&lt;/font&gt;&lt;br /&gt;
  
  &lt;br /&gt;
  &amp;lt;style type=&amp;quot;text/css&amp;quot;&amp;gt;&lt;br /&gt;
  body {&lt;br /&gt;
  background: url(&amp;#039;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;images/background.jpg&lt;/span&gt;&amp;#039;) no-repeat #2D5594;&lt;br /&gt;
  background-attachment: fixed;&lt;br /&gt;
  }&lt;br /&gt;
  &amp;lt;/style&amp;gt;&lt;br /&gt;
  &lt;br /&gt;
  
  &lt;font style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;/head&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;

  &lt;font style=&quot;color:#FF6600;&quot;&gt;&amp;lt;body&amp;gt;&lt;/font&gt;&lt;br /&gt;
  
  &lt;br /&gt;
    
  &lt;font style=&quot;color:#FF6600;&quot;&gt;&amp;lt;/body&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;/html&amp;gt;&lt;/font&gt;
  
  &lt;p style=&quot;background:#5E5E5E;color:white;text-align:center;font-weight:bold;margin:40px 0 0px 0;padding:5px;border:#000 solid 1px;&quot;&gt;
   Keterangan
   &lt;/p&gt;
  &lt;div style=&quot;background:#EFEFEF;border-left:#000 solid 1px;border-right:#000 solid 1px;border-bottom:#000 solid 1px; padding:10px 5px 0px 0px;&quot;&gt;
   
   &lt;ol&gt;
    &lt;li&gt;
     &lt;i&gt;Sisipkan sebuah style code untuk memasang cursor di atas tag &lt;span style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;/head&amp;gt;&lt;/span&gt; seperti pada contoh di atas, ganti &amp;#39;&lt;span style=&quot;color:red;&quot;&gt;images/background.jpg&lt;/span&gt;&amp;#39; dengan url tempat Anda menyimpan file images/gambar yang akan dijadikan sebagai background.&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Bagian terpenting agar background menjadi tetap pada tempatnya (fixed) yaitu pada script &lt;span style=&quot;color:red;background:yellow;&quot;&gt;background-attachment: fixed;&lt;/span&gt;.&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Silahkan download contoh cara membuat background tetap (fixed) dalam bentuk file HTML pada Link Di bawah ini.&lt;/i&gt;
    &lt;/li&gt;
   &lt;/ol&gt;
  &lt;p style=&quot;background:#5E5E5E;color:white;text-align:center;font-weight:bold;margin:0 -5px 0 0;padding:5px;border-top:#EFEFEF solid 1px;&quot;&gt;
   &lt;a href=&quot;http://adf.ly/wZuY8&quot; target=&quot;_blank&quot; style=&quot;color:white;text-decoration:none;outline:none;&quot;&gt;Download Example Here&lt;/a&gt;
   &lt;/p&gt;
  &lt;/div&gt;
  

&lt;/div&gt;
&lt;/div&gt;
 
&lt;/ol&gt;

&lt;br /&gt;

&lt;p style=&quot;text-align:justify;margin:15px;border-top:#000 solid 1px;&quot;&gt;&lt;blink&gt;&lt;font style=&quot;color:red;&quot;&gt;&lt;b&gt;Nb.&lt;/b&gt;&lt;/font&gt;&lt;/blink&gt; Silahkan beri &lt;i&gt;feed back&lt;/i&gt; pada kotak komentar di bawah!&lt;/p&gt;
 

&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;</description><link>http://amirabella-zone.blogspot.com/2013/03/cara-membuat-background-tetap-pada.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimY7YJWX7JyJSAtPvcFDllNTCuOHhYp9S5-Y45E9s4b7rULWc-T5z0l5pTzKdh6LtYYnoHKsomgxKlfKcC48MHvaWAe7EjwzmbSWUV3jXMx3UFFkbsKNNztZQIJ70JjyJiZWnczrQsiog/s72-c/Background-Tetap.jpg" height="72" width="72"/><thr:total>1</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-3593495568756660568</guid><pubDate>Tue, 19 Mar 2013 12:45:00 +0000</pubDate><atom:updated>2015-01-24T18:43:24.630+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">HTML</category><title>Cara Memasang Cursor Pada Dokumen HTML</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikB3hROxQaAEHyDP4PZc-3ifiCSz-1tpXxIH4kVPTne_fmSkZTQC_b2kX_nmBlEgnvUnLtX-nyUr5duBfGEqe_M6gshGTHaVLQJ1NBPm90sYoJkDPAVS25Mbt5fwpuKfYDRW5ZI00-7nY/s1600/Cursor.png&quot; imageanchor=&quot;1&quot; style=&quot;clear:left; float:left;margin-right:1em; margin-bottom:1em&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;150&quot; width=&quot;200&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikB3hROxQaAEHyDP4PZc-3ifiCSz-1tpXxIH4kVPTne_fmSkZTQC_b2kX_nmBlEgnvUnLtX-nyUr5duBfGEqe_M6gshGTHaVLQJ1NBPm90sYoJkDPAVS25Mbt5fwpuKfYDRW5ZI00-7nY/s320/Cursor.png&quot; alt=&quot;Cara Memasang Cursor Pada Dokumen HTML&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Pada posting sebelumnya saya share &lt;a href=&quot;http://www.amirabella-zone.blogspot.com/2013/03/cara-memasang-favicon-pada-dokumen-html.html&quot;&gt;&lt;i&gt;&amp;#39;Cara Memasang Favicon Pada Dokumen HTML&amp;#39;&lt;/i&gt;&lt;/a&gt;, sekarang saya lanjutkan dengan share &lt;a href=&quot;http://www.amirabella-zone.blogspot.com/2013/03/cara-memasang-cursor-pada-dokumen-html.html&quot;&gt;&lt;i&gt;&amp;#39;Cara Memasang Cursor Pada Dokumen HTML&amp;#39;&lt;/i&gt;&lt;/a&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;Cursor&lt;/b&gt; adalah sebuah &lt;i&gt;indicator&lt;/i&gt; yang digunakan untuk menunjukan posisi pada sebuah monitor/layar komputer. Diantara fungsi dari &lt;i&gt;cursor&lt;/i&gt; yaitu untuk mengeksekusi sebuah &lt;i&gt;content&lt;/i&gt; sebagai contoh sebuah tombol atau menu yang ditampilkan di dalam layar/monitor sebuah komputer. &lt;i&gt;Cursor&lt;/i&gt; pada umumnya memiliki bentuk &lt;i&gt;default&lt;/i&gt; sebuah panah kecil berwarna putih, yang mungkin terlihat kurang begitu menarik. Untuk membuatnya terlihat lebih cantik, kita dapat mengganti dengan &lt;i&gt;icon cursor&lt;/i&gt; yang kita kehendaki.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Baiklah berikut ini cara memasang &lt;b&gt;&lt;i&gt;Cursor&lt;/i&gt;&lt;/b&gt; pada sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;.
&lt;/p&gt;

&lt;br /&gt;

&lt;div&gt;
&lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;Langkah-langkah:&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

&lt;p style=&quot;text-align:justify;margin:15px&quot;&gt;&lt;b&gt;&lt;u&gt;Cara Memasang Cursor Pada Dokumen HTML:&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;

&lt;ol style=&quot;margin-right:15px;&quot;&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;Jalankan aplikasi &lt;i&gt;text editor&lt;/i&gt; seperti &lt;i&gt;&amp;#39;notepad&amp;#39;&lt;/i&gt; untuk menulis sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;. Mungkin &lt;i&gt;notepad&lt;/i&gt; bawaan &lt;i&gt;windows&lt;/i&gt; kurang begitu menarik, solusinya Anda dapat menggunakan aplikasi &lt;i&gt;notepad++&lt;/i&gt; yang dapat Anda download di &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-notepad-63.html&quot;&gt;sini&lt;/a&gt;.&lt;/li&gt;
 &lt;br /&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;&lt;b&gt;&lt;i&gt;Penting!&lt;/i&gt;&lt;/b&gt; simpan dokumen &lt;i&gt;HTML&lt;/i&gt; dengan format &lt;b&gt;&lt;i&gt;&amp;#39;Nama_File.html&amp;#39;&lt;/i&gt;&lt;/b&gt; tanpa tanda kutip, kemudian pada &lt;i&gt;&amp;#39;Save as type&amp;#39;&lt;/i&gt; Anda pilih &lt;i&gt;&amp;#39;All files&amp;#39;&lt;/i&gt; agar dokumen yang Anda simpan menjadi dokumen &lt;i&gt;HTML&lt;/i&gt; bukan dokumen &lt;i&gt;text biasa&lt;/i&gt;.&lt;/li&gt; 
 &lt;br /&gt; 
 &lt;li style=&quot;text-align:justify&quot;&gt;Sekarang mari kita mulai untuk memasang &lt;i&gt;Cursor&lt;/i&gt; pada dokumen &lt;i&gt;HTML&lt;/i&gt; seperti pada kotak di bawah ini.&lt;/li&gt;
 
 &lt;br /&gt;
 
 &lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;&lt;i&gt;Script Code:&lt;/i&gt;&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

  &lt;font style=&quot;color:#f83ab8;&quot;&gt;&amp;lt;!DOCTYPE html&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;html&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;head&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#59fa38;&quot;&gt;&amp;lt;title&amp;gt;&lt;/font&gt; Cara Memasang Cursor Pada Dokumen HTML &lt;font style=&quot;color:#59fa38;&quot;&gt;&amp;lt;/title&amp;gt;&lt;/font&gt;&lt;br /&gt;
  
  &lt;br /&gt;
  &amp;lt;style type=&amp;quot;text/css&amp;quot;&amp;gt;&lt;br /&gt;
   body {&lt;br /&gt;
    cursor: url(&amp;#039;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;images/cur.cur&lt;/span&gt;&amp;#039;), default;&lt;br /&gt;
    }&lt;br /&gt;
  &amp;lt;/style&amp;gt;&lt;br /&gt;
  &lt;br /&gt;
  
  &lt;font style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;/head&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;

  &lt;font style=&quot;color:#FF6600;&quot;&gt;&amp;lt;body&amp;gt;&lt;/font&gt;&lt;br /&gt;
  
  &lt;br /&gt;
    
  &lt;font style=&quot;color:#FF6600;&quot;&gt;&amp;lt;/body&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;/html&amp;gt;&lt;/font&gt;
  
  &lt;p style=&quot;background:#5E5E5E;color:white;text-align:center;font-weight:bold;margin:40px 0 0px 0;padding:5px;border:#000 solid 1px;&quot;&gt;
   Keterangan
   &lt;/p&gt;
  &lt;div style=&quot;background:#EFEFEF;border-left:#000 solid 1px;border-right:#000 solid 1px;border-bottom:#000 solid 1px; padding:10px 5px 0px 0px;&quot;&gt;
   
   &lt;ol&gt;
    &lt;li&gt;
     &lt;i&gt;Sisipkan sebuah style code untuk memasang cursor di atas tag &lt;span style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;/head&amp;gt;&lt;/span&gt; seperti pada contoh di atas, ganti &amp;#39;&lt;span style=&quot;color:red;&quot;&gt;images/cur.cur&lt;/span&gt;&amp;#39; dengan url tempat Anda menyimpan file icon cursor yang akan dijadikan sebagai default cursor.&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Anda dapat mendownload icon cursor di &lt;a href=&quot;http://adf.ly/wZuDv&quot; target=&quot;_blank&quot;&gt;sini&lt;/a&gt;.&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Silahkan download contoh cara memasang icon cursor dalam bentuk file HTML pada Link Di bawah ini.&lt;/i&gt;
    &lt;/li&gt;
   &lt;/ol&gt;
  &lt;p style=&quot;background:#5E5E5E;color:white;text-align:center;font-weight:bold;margin:0 -5px 0 0;padding:5px;border-top:#EFEFEF solid 1px;&quot;&gt;
   &lt;a href=&quot;http://adf.ly/wZuL3&quot; target=&quot;_blank&quot; style=&quot;color:white;text-decoration:none;outline:none;&quot;&gt;Download Example Here&lt;/a&gt;
   &lt;/p&gt;
  &lt;/div&gt;
  

&lt;/div&gt;
&lt;/div&gt;
 
&lt;/ol&gt;

&lt;br /&gt;

&lt;p style=&quot;text-align:justify;margin:15px;border-top:#000 solid 1px;&quot;&gt;&lt;blink&gt;&lt;font style=&quot;color:red;&quot;&gt;&lt;b&gt;Nb.&lt;/b&gt;&lt;/font&gt;&lt;/blink&gt; Silahkan beri &lt;i&gt;feed back&lt;/i&gt; pada kotak komentar di bawah!&lt;/p&gt;
 

&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;

</description><link>http://amirabella-zone.blogspot.com/2013/03/cara-memasang-cursor-pada-dokumen-html.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikB3hROxQaAEHyDP4PZc-3ifiCSz-1tpXxIH4kVPTne_fmSkZTQC_b2kX_nmBlEgnvUnLtX-nyUr5duBfGEqe_M6gshGTHaVLQJ1NBPm90sYoJkDPAVS25Mbt5fwpuKfYDRW5ZI00-7nY/s72-c/Cursor.png" height="72" width="72"/><thr:total>0</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-2878645454031522748</guid><pubDate>Mon, 18 Mar 2013 22:16:00 +0000</pubDate><atom:updated>2015-01-24T18:44:17.163+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">HTML</category><title>Cara Memasang Favicon Pada Dokumen HTML</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjZnTqGhIICzmTSdB6BGb3GeFPoGBKbl9qBTjd6DItuDKfTN0xz7uB8kHY8OqpXm6naF-d6XVRgcJmCSoBym0G-TJkz-BagyJkzSuIzBJyaY2bFhz4gauYMCx1w48Yhwyv4jWwAcx9SMY/s1600/Favicon.png&quot; imageanchor=&quot;1&quot; style=&quot;clear:left; float:left;margin-right:1em; margin-bottom:1em&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;150&quot; width=&quot;200&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjZnTqGhIICzmTSdB6BGb3GeFPoGBKbl9qBTjd6DItuDKfTN0xz7uB8kHY8OqpXm6naF-d6XVRgcJmCSoBym0G-TJkz-BagyJkzSuIzBJyaY2bFhz4gauYMCx1w48Yhwyv4jWwAcx9SMY/s320/Favicon.png&quot; alt=&quot;Cara Memasang Favicon Pada Dokumen HTML&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Pada posting sebelumnya saya share &lt;a href=&quot;http://www.amirabella-zone.blogspot.com/2013/03/cara-membuat-running-title-pada-dokumen.html&quot;&gt;&lt;i&gt;&amp;#39;Cara Membuat Running Title Pada Dokumen HTML&amp;#39;&lt;/i&gt;&lt;/a&gt;, sekarang saya lanjutkan dengan share &lt;a href=&quot;http://www.amirabella-zone.blogspot.com/2013/03/cara-memasang-favicon-pada-dokumen-html.html&quot;&gt;&lt;i&gt;&amp;#39;Cara Memasang Favicon Pada Dokumen HTML&amp;#39;&lt;/i&gt;&lt;/a&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;Favicon&lt;/b&gt; adalah sebuah &lt;i&gt;image&lt;/i&gt; atau gambar &lt;i&gt;(icon)&lt;/i&gt; yang ditampilkan pada &lt;i&gt;address bar&lt;/i&gt; dan &lt;i&gt;tab&lt;/i&gt; sebuah &lt;i&gt;browser&lt;/i&gt; internet yang biasanya merupakan logo dari sebuah &lt;i&gt;website&lt;/i&gt;. Keberadaan sebuah &lt;i&gt;Favicon&lt;/i&gt; ini sangat penting khususnya untuk membedakan sebuah &lt;i&gt;website&lt;/i&gt; dengan &lt;i&gt;website&lt;/i&gt; lainnya. &lt;i&gt;Favicon&lt;/i&gt; biasanya menggunakan file &lt;i&gt;image&lt;/i&gt; berekstensi &lt;i&gt;&amp;#39;ICO, GIF &amp;amp; PNG&amp;#39;&lt;/i&gt; namun lebih disarankan untuk menggunakan file &lt;i&gt;&amp;#39;.ICO&amp;#39;&lt;/i&gt; karena lebih &lt;i&gt;compatible&lt;/i&gt; dengan semua &lt;i&gt;browser&lt;/i&gt; internet.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Baiklah berikut ini cara memasang &lt;b&gt;&lt;i&gt;Favicon&lt;/i&gt;&lt;/b&gt; pada sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;.
&lt;/p&gt;

&lt;br /&gt;

&lt;div&gt;
&lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;Langkah-langkah:&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

&lt;p style=&quot;text-align:justify;margin:15px&quot;&gt;&lt;b&gt;&lt;u&gt;Cara Memasang Favicon Pada Dokumen HTML:&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;

&lt;ol style=&quot;margin-right:15px;&quot;&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;Jalankan aplikasi &lt;i&gt;text editor&lt;/i&gt; seperti &lt;i&gt;&amp;#39;notepad&amp;#39;&lt;/i&gt; untuk menulis sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;. Mungkin &lt;i&gt;notepad&lt;/i&gt; bawaan &lt;i&gt;windows&lt;/i&gt; kurang begitu menarik, solusinya Anda dapat menggunakan aplikasi &lt;i&gt;notepad++&lt;/i&gt; yang dapat Anda download di &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-notepad-63.html&quot; target=&quot;_blank&quot;&gt;sini&lt;/a&gt;.&lt;/li&gt;
 &lt;br /&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;&lt;b&gt;&lt;i&gt;Penting!&lt;/i&gt;&lt;/b&gt; simpan dokumen &lt;i&gt;HTML&lt;/i&gt; dengan format &lt;b&gt;&lt;i&gt;&amp;#39;Nama_File.html&amp;#39;&lt;/i&gt;&lt;/b&gt; tanpa tanda kutip, kemudian pada &lt;i&gt;&amp;#39;Save as type&amp;#39;&lt;/i&gt; Anda pilih &lt;i&gt;&amp;#39;All files&amp;#39;&lt;/i&gt; agar dokumen yang Anda simpan menjadi dokumen &lt;i&gt;HTML&lt;/i&gt; bukan dokumen &lt;i&gt;text biasa&lt;/i&gt;.&lt;/li&gt; 
 &lt;br /&gt; 
 &lt;li style=&quot;text-align:justify&quot;&gt;Sekarang mari kita mulai untuk memasang &lt;i&gt;Favicon&lt;/i&gt; pada dokumen &lt;i&gt;HTML&lt;/i&gt; seperti pada kotak di bawah ini.&lt;/li&gt;
 
 &lt;br /&gt;
 
 &lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;&lt;i&gt;Script Code:&lt;/i&gt;&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

  &lt;font style=&quot;color:#f83ab8;&quot;&gt;&amp;lt;!DOCTYPE html&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;html&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;head&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#59fa38;&quot;&gt;&amp;lt;title&amp;gt;&lt;/font&gt; Cara Memasang Favicon Pada Dokumen HTML &lt;font style=&quot;color:#59fa38;&quot;&gt;&amp;lt;/title&amp;gt;&lt;/font&gt;&lt;br /&gt;
  
  &lt;br /&gt;
  &amp;lt;link &lt;span style=&quot;color:#586dab;&quot;&gt;href&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;favicon.ico&lt;/span&gt;&amp;quot; rel=&amp;quot;shortcut icon&amp;quot; /&amp;gt; &lt;br /&gt;
  &lt;br /&gt;
  
  &lt;font style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;/head&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;

  &lt;font style=&quot;color:#FF6600;&quot;&gt;&amp;lt;body&amp;gt;&lt;/font&gt;&lt;br /&gt;
  
  &lt;br /&gt;
    
  &lt;font style=&quot;color:#FF6600;&quot;&gt;&amp;lt;/body&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;/html&amp;gt;&lt;/font&gt;
  
  &lt;p style=&quot;background:#5E5E5E;color:white;text-align:center;font-weight:bold;margin:40px 0 0px 0;padding:5px;border:#000 solid 1px;&quot;&gt;
   Keterangan
   &lt;/p&gt;
  &lt;div style=&quot;background:#EFEFEF;border-left:#000 solid 1px;border-right:#000 solid 1px;border-bottom:#000 solid 1px; padding:10px 5px 0px 0px;&quot;&gt;
   
   &lt;ol&gt;
    &lt;li&gt;
     &lt;i&gt;Sisipkan sebuah code untuk memasang favicon di atas tag &lt;span style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;/head&amp;gt;&lt;/span&gt; seperti pada contoh di atas, ganti &amp;#39;&lt;span style=&quot;color:red;&quot;&gt;favicon.ico&lt;/span&gt;&amp;#39; dengan url tempat Anda menyimpan file images yang akan dijadikan sebagai favicon.&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Disarankan ukuran file images (icon) yang akan dijadikan sebagai favicon &lt;span style=&quot;background:white;&quot;&gt;16x16px&lt;/span&gt;.&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Silahkan download contoh cara memasang favicon dalam bentuk file HTML pada Link Di bawah ini.&lt;/i&gt;
    &lt;/li&gt;
   &lt;/ol&gt;
  &lt;p style=&quot;background:#5E5E5E;color:white;text-align:center;font-weight:bold;margin:0 -5px 0 0;padding:5px;border-top:#EFEFEF solid 1px;&quot;&gt;
   &lt;a href=&quot;http://adf.ly/wZtqC&quot; target=&quot;_blank&quot; style=&quot;color:white;text-decoration:none;outline:none;&quot;&gt;Download Example Here&lt;/a&gt;
   &lt;/p&gt;
  &lt;/div&gt;
  

&lt;/div&gt;
&lt;/div&gt;
 
&lt;/ol&gt;

&lt;br /&gt;

&lt;p style=&quot;text-align:justify;margin:15px;border-top:#000 solid 1px;&quot;&gt;&lt;blink&gt;&lt;font style=&quot;color:red;&quot;&gt;&lt;b&gt;Nb.&lt;/b&gt;&lt;/font&gt;&lt;/blink&gt; Silahkan beri &lt;i&gt;feed back&lt;/i&gt; pada kotak komentar di bawah!&lt;/p&gt;
 

&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;</description><link>http://amirabella-zone.blogspot.com/2013/03/cara-memasang-favicon-pada-dokumen-html.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjZnTqGhIICzmTSdB6BGb3GeFPoGBKbl9qBTjd6DItuDKfTN0xz7uB8kHY8OqpXm6naF-d6XVRgcJmCSoBym0G-TJkz-BagyJkzSuIzBJyaY2bFhz4gauYMCx1w48Yhwyv4jWwAcx9SMY/s72-c/Favicon.png" height="72" width="72"/><thr:total>2</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-8711822091479053650</guid><pubDate>Mon, 18 Mar 2013 14:41:00 +0000</pubDate><atom:updated>2015-01-24T18:46:25.719+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">HTML</category><title>Cara Membuat Running Title Pada Dokumen HTML</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGLwcB8GkuR-U9xx5_ZjFccO3a0znLl6AGgwRn_At6ugLPekYml-cWoDI03FGUMHiKqkRSmvp26BR0wKWaL7Wkp7knvkIF8vFAdwgnJABdVRhlX0jLCrRBrp-TbpyLo4c65vSNh52qQPo/s1600/RunningTitle.png&quot; imageanchor=&quot;1&quot; style=&quot;clear:left; float:left;margin-right:1em; margin-bottom:1em&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;150&quot; width=&quot;200&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGLwcB8GkuR-U9xx5_ZjFccO3a0znLl6AGgwRn_At6ugLPekYml-cWoDI03FGUMHiKqkRSmvp26BR0wKWaL7Wkp7knvkIF8vFAdwgnJABdVRhlX0jLCrRBrp-TbpyLo4c65vSNh52qQPo/s320/RunningTitle.png&quot; alt=&quot;Cara Membuat Running Title Pada Dokumen HTML&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Pada posting sebelumnya saya share &lt;a href=&quot;http://www.amirabella-zone.blogspot.com/2013/03/cara-membuat-link-pelangi-pada-dokumen.html&quot;&gt;&lt;i&gt;&amp;#39;Cara Membuat Link Pelangi Pada Dokumen HTML&amp;#39;&lt;/i&gt;&lt;/a&gt;, sekarang saya lanjutkan dengan share &lt;a href=&quot;http://www.amirabella-zone.blogspot.com/2013/03/cara-membuat-running-title-pada-dokumen.html&quot;&gt;&lt;i&gt;&amp;#39;Cara Membuat Running Title Pada Dokumen HTML&amp;#39;&lt;/i&gt;&lt;/a&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;Running Title&lt;/b&gt; adalah sebuah &lt;i&gt;title (judul)&lt;/i&gt; dari sebuah dokumen &lt;i&gt;HTML&lt;/i&gt; yang dikombinasikan dengan penggunaan &lt;i&gt;javascript&lt;/i&gt; sehingga dapat menampilkan sebuah &lt;i&gt;title&lt;/i&gt; dengan efek &lt;i&gt;scroll (title berjalan)&lt;/i&gt;. &lt;i&gt;Title&lt;/i&gt; dari dokumen &lt;i&gt;HTML&lt;/i&gt; itu sendiri dapat kita lihat pada tab browser seperti &lt;i&gt;Internet Explorer, Modzila Firefox, Google Chrome, dsb&lt;/i&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Baiklah berikut ini cara membuat &lt;b&gt;&lt;i&gt;Running Title&lt;/i&gt;&lt;/b&gt; pada sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;.
&lt;/p&gt;

&lt;br /&gt;

&lt;div&gt;
&lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;Langkah-langkah:&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

&lt;p style=&quot;text-align:justify;margin:15px&quot;&gt;&lt;b&gt;&lt;u&gt;Cara Membuat Running Title Pada Dokumen HTML:&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;

&lt;ol style=&quot;margin-right:15px;&quot;&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;Jalankan aplikasi &lt;i&gt;text editor&lt;/i&gt; seperti &lt;i&gt;&amp;#39;notepad&amp;#39;&lt;/i&gt; untuk menulis sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;. Mungkin &lt;i&gt;notepad&lt;/i&gt; bawaan &lt;i&gt;windows&lt;/i&gt; kurang begitu menarik, solusinya Anda dapat menggunakan aplikasi &lt;i&gt;notepad++&lt;/i&gt; yang dapat Anda download di &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-notepad-63.html&quot; target=&quot;_blank&quot;&gt;sini&lt;/a&gt;.&lt;/li&gt;
 &lt;br /&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;&lt;b&gt;&lt;i&gt;Penting!&lt;/i&gt;&lt;/b&gt; simpan dokumen &lt;i&gt;HTML&lt;/i&gt; dengan format &lt;b&gt;&lt;i&gt;&amp;#39;Nama_File.html&amp;#39;&lt;/i&gt;&lt;/b&gt; tanpa tanda kutip, kemudian pada &lt;i&gt;&amp;#39;Save as type&amp;#39;&lt;/i&gt; Anda pilih &lt;i&gt;&amp;#39;All files&amp;#39;&lt;/i&gt; agar dokumen yang Anda simpan menjadi dokumen &lt;i&gt;HTML&lt;/i&gt; bukan dokumen &lt;i&gt;text biasa&lt;/i&gt;.&lt;/li&gt; 
 &lt;br /&gt; 
 &lt;li style=&quot;text-align:justify&quot;&gt;Sekarang mari kita mulai untuk membuat &lt;i&gt;Running Title&lt;/i&gt; pada dokumen &lt;i&gt;HTML&lt;/i&gt; seperti pada kotak di bawah ini.&lt;/li&gt;
 
 &lt;br /&gt;
 
 &lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;&lt;i&gt;Script Code:&lt;/i&gt;&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

  &lt;font style=&quot;color:#f83ab8;&quot;&gt;&amp;lt;!DOCTYPE html&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;html&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;head&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#59fa38;&quot;&gt;&amp;lt;title&amp;gt;&lt;/font&gt; Cara Membuat Running Title Pada Dokumen HTML &lt;font style=&quot;color:#59fa38;&quot;&gt;&amp;lt;/title&amp;gt;&lt;/font&gt;&lt;br /&gt;
  
  &lt;br /&gt;
  &amp;lt;script language=&amp;quot;JavaScript&amp;quot; type=&amp;quot;text/javascript&amp;quot;&amp;gt; &lt;br /&gt;
  var txt = &amp;quot; &lt;span style=&quot;color:red;background:yellow;&quot;&gt;Welcome To Amirabella-Zone&lt;/span&gt; .::. &amp;quot;; &lt;br /&gt;
  var speed = &lt;span style=&quot;color:red;background:yellow;&quot;&gt;250&lt;/span&gt;; &lt;br /&gt;
  var refresh = null; &lt;br /&gt;
  function move() { &lt;br /&gt;
   document.title=txt; &lt;br /&gt;
   txt=txt.substring(1,txt.length)+txt.charAt(0); &lt;br /&gt;
   refresh=setTimeout(&amp;quot;move()&amp;quot;,speed);} &lt;br /&gt;
   move(); &lt;br /&gt;
  &amp;lt;/script&amp;gt; &lt;br /&gt; 
  &lt;br /&gt;
  
  &lt;font style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;/head&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;

  &lt;font style=&quot;color:#FF6600;&quot;&gt;&amp;lt;body&amp;gt;&lt;/font&gt;&lt;br /&gt;
  
  &lt;br /&gt;
    
  &lt;font style=&quot;color:#FF6600;&quot;&gt;&amp;lt;/body&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;/html&amp;gt;&lt;/font&gt;
  
  &lt;p style=&quot;background:#5E5E5E;color:white;text-align:center;font-weight:bold;margin:40px 0 0px 0;padding:5px;border:#000 solid 1px;&quot;&gt;
   Keterangan
   &lt;/p&gt;
  &lt;div style=&quot;background:#EFEFEF;border-left:#000 solid 1px;border-right:#000 solid 1px;border-bottom:#000 solid 1px; padding:10px 5px 0px 0px;&quot;&gt;
   
   &lt;ol&gt;
    &lt;li&gt;
     &lt;i&gt;Sisipkan JavaScript Running Title di atas tag &lt;span style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;/head&amp;gt;&lt;/span&gt; seperti pada code di atas, ganti &amp;#39;&lt;span style=&quot;color:red;&quot;&gt;Welcome To Amirabella-Zone&lt;/span&gt;&amp;#39; dengan Title yang Anda kehendaki.&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Ganti angka &amp;#39;&lt;span style=&quot;color:red;&quot;&gt;250&lt;/span&gt;&amp;#39; dengan value yang Anda kehendaki (semakin kecil angkanya kecepatan efek scrollnya semakin cepat).&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Silahkan download contoh file HTML Running Title pada Link Di bawah ini.&lt;/i&gt;
    &lt;/li&gt;
   &lt;/ol&gt;
  &lt;p style=&quot;background:#5E5E5E;color:white;text-align:center;font-weight:bold;margin:0 -5px 0 0;padding:5px;border-top:#EFEFEF solid 1px;&quot;&gt;
   &lt;a href=&quot;http://adf.ly/wZtVS&quot; target=&quot;_blank&quot; style=&quot;color:white;text-decoration:none;outline:none;&quot;&gt;Download Example Here&lt;/a&gt;
   &lt;/p&gt;
  &lt;/div&gt;
  

&lt;/div&gt;
&lt;/div&gt;
 
&lt;/ol&gt;

&lt;br /&gt;

&lt;p style=&quot;text-align:justify;margin:15px;border-top:#000 solid 1px;&quot;&gt;&lt;blink&gt;&lt;font style=&quot;color:red;&quot;&gt;&lt;b&gt;Nb.&lt;/b&gt;&lt;/font&gt;&lt;/blink&gt; Silahkan beri &lt;i&gt;feed back&lt;/i&gt; pada kotak komentar di bawah!&lt;/p&gt;
 

&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;</description><link>http://amirabella-zone.blogspot.com/2013/03/cara-membuat-running-title-pada-dokumen.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGLwcB8GkuR-U9xx5_ZjFccO3a0znLl6AGgwRn_At6ugLPekYml-cWoDI03FGUMHiKqkRSmvp26BR0wKWaL7Wkp7knvkIF8vFAdwgnJABdVRhlX0jLCrRBrp-TbpyLo4c65vSNh52qQPo/s72-c/RunningTitle.png" height="72" width="72"/><thr:total>0</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-2542065861133359058</guid><pubDate>Sat, 16 Mar 2013 08:37:00 +0000</pubDate><atom:updated>2015-01-24T18:46:47.610+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">HTML</category><title>Cara Membuat Link Pelangi Pada Dokumen HTML</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgl85x4mpBqVapp-7s7B-D3xfL_hqjr5PhMSleZhQy9WytbYX2oPhlBQSOydwz4YViuy2AS0ZnGEoIab-y_RrmjqsAfWenkyZnZmPrtiEj8iY1g5ZP_gBIoDUqt_ixlJwh7sJNF_qUENks/s1600/RainbowLink.png&quot; imageanchor=&quot;1&quot; style=&quot;clear:left; float:left;margin-right:1em; margin-bottom:1em&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;150&quot; width=&quot;200&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgl85x4mpBqVapp-7s7B-D3xfL_hqjr5PhMSleZhQy9WytbYX2oPhlBQSOydwz4YViuy2AS0ZnGEoIab-y_RrmjqsAfWenkyZnZmPrtiEj8iY1g5ZP_gBIoDUqt_ixlJwh7sJNF_qUENks/s320/RainbowLink.png&quot; alt=&quot;Cara Membuat Link Pelangi Pada Dokumen HTML&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Pada posting sebelumnya saya share &lt;a href=&quot;http://www.amirabella-zone.blogspot.com/2013/03/cara-membuat-text-pelangi-pada-dokumen_16.html&quot;&gt;&lt;i&gt;&amp;#39;Cara Membuat Text Pelangi Pada Dokumen HTML&amp;#39;&lt;/i&gt;&lt;/a&gt;, sekarang saya lanjutkan dengan share &lt;a href=&quot;http://www.amirabella-zone.blogspot.com/2013/03/cara-membuat-link-pelangi-pada-dokumen.html&quot;&gt;&lt;i&gt;&amp;#39;Cara Membuat Link Pelangi Pada Dokumen HTML&amp;#39;&lt;/i&gt;&lt;/a&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;Link Pelangi&lt;/b&gt; adalah sebuah &lt;i&gt;link (hyperlink)&lt;/i&gt; yang di kombinasikan dengan penggunaan &lt;i&gt;javascript&lt;/i&gt; sehingga dapat membuat sebuah &lt;i&gt;link&lt;/i&gt; yang apabila di sorot akan menampilkan efek berkedip-kedip dan warna-warni atau yang di sebut dengan &lt;i&gt;Link Pelangi&lt;/i&gt;. Sedangkan &lt;b&gt;Link&lt;/b&gt; itu sendiri adalah sebuah acuan dalam dokumen hiperteks &lt;i&gt;(hypertext)&lt;/i&gt; ke dokumen yang lain atau sumber lain.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Baiklah berikut ini cara membuat &lt;b&gt;&lt;i&gt;Link Pelangi&lt;/i&gt;&lt;/b&gt; pada sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;.
&lt;/p&gt;

&lt;br /&gt;

&lt;div&gt;
&lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;Langkah-langkah:&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

&lt;p style=&quot;text-align:justify;margin:15px&quot;&gt;&lt;b&gt;&lt;u&gt;Cara Membuat Link Pelangi Pada Dokumen HTML:&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;

&lt;ol style=&quot;margin-right:15px;&quot;&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;Jalankan aplikasi &lt;i&gt;text editor&lt;/i&gt; seperti &lt;i&gt;&amp;#39;notepad&amp;#39;&lt;/i&gt; untuk menulis sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;. Mungkin &lt;i&gt;notepad&lt;/i&gt; bawaan &lt;i&gt;windows&lt;/i&gt; kurang begitu menarik, solusinya Anda dapat menggunakan aplikasi &lt;i&gt;notepad++&lt;/i&gt; yang dapat Anda download di &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-notepad-63.html&quot; target=&quot;_blank&quot;&gt;sini&lt;/a&gt;.&lt;/li&gt;
 &lt;br /&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;&lt;b&gt;&lt;i&gt;Penting!&lt;/i&gt;&lt;/b&gt; simpan dokumen &lt;i&gt;HTML&lt;/i&gt; dengan format &lt;b&gt;&lt;i&gt;&amp;#39;Nama_File.html&amp;#39;&lt;/i&gt;&lt;/b&gt; tanpa tanda kutip, kemudian pada &lt;i&gt;&amp;#39;Save as type&amp;#39;&lt;/i&gt; Anda pilih &lt;i&gt;&amp;#39;All files&amp;#39;&lt;/i&gt; agar dokumen yang Anda simpan menjadi dokumen &lt;i&gt;HTML&lt;/i&gt; bukan dokumen &lt;i&gt;text biasa&lt;/i&gt;.&lt;/li&gt; 
 &lt;br /&gt; 
 &lt;li style=&quot;text-align:justify&quot;&gt;Sekarang mari kita mulai untuk membuat &lt;i&gt;Link Pelangi&lt;/i&gt; pada dokumen &lt;i&gt;HTML&lt;/i&gt; seperti pada kotak di bawah ini.&lt;/li&gt;
 
 &lt;br /&gt;
 
 &lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;&lt;i&gt;Script Code:&lt;/i&gt;&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

  &lt;font style=&quot;color:#f83ab8;&quot;&gt;&amp;lt;!DOCTYPE html&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;html&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;head&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#59fa38;&quot;&gt;&amp;lt;title&amp;gt;&lt;/font&gt; Cara Membuat Link Pelangi Pada Dokumen HTML &lt;font style=&quot;color:#59fa38;&quot;&gt;&amp;lt;/title&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;br /&gt;
  &amp;lt;script &lt;span style=&quot;color:#586dab;&quot;&gt;src&lt;/span&gt;=&amp;#039;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;js/rainbow-link.js&lt;/span&gt;&amp;#039; type=&amp;#039;text/javascript&amp;#039;&amp;gt;&amp;lt;/script&amp;gt;&lt;br /&gt;
  &lt;br /&gt;
  &lt;font style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;/head&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;

  &lt;font style=&quot;color:#FF6600;&quot;&gt;&amp;lt;body&amp;gt;&lt;/font&gt;
  
&lt;p&gt;&lt;blink&gt;&lt;span style=&quot;color:green;&quot;&gt;&amp;lt;!-- Start Link Pelangi Code --&amp;gt;&lt;/span&gt;&lt;/blink&gt;&lt;/p&gt;
  
 &amp;lt;a &lt;span style=&quot;color:#586dab;&quot;&gt;href&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;www.amirabella-zone.blogspot.com&lt;/span&gt;&amp;quot;&amp;gt;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Nama Link&lt;/span&gt;&amp;lt;/a&amp;gt;
 
&lt;p&gt;&lt;blink&gt;&lt;span style=&quot;color:green;&quot;&gt;&amp;lt;!-- // End Link Pelangi Code --&amp;gt;&lt;/span&gt;&lt;/blink&gt;&lt;/p&gt;
 
  
  &lt;font style=&quot;color:#FF6600;&quot;&gt;&amp;lt;/body&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;/html&amp;gt;&lt;/font&gt;
  
  &lt;p style=&quot;background:#5E5E5E;color:white;text-align:center;font-weight:bold;margin:40px 0 0px 0;padding:5px;border:#000 solid 1px;&quot;&gt;
   Keterangan
   &lt;/p&gt;
  &lt;div style=&quot;background:#EFEFEF;border-left:#000 solid 1px;border-right:#000 solid 1px;border-bottom:#000 solid 1px; padding:10px 5px 0px 0px;&quot;&gt;
   
   &lt;ol&gt;
    &lt;li&gt;
     &lt;i&gt;Sisipkan JavaScript Text Pelangi di atas tag &lt;span style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;/head&amp;gt;&lt;/span&gt; seperti pada code di atas, ganti &amp;#39;&lt;span style=&quot;color:red;&quot;&gt;js/rainbow-link.js&lt;/span&gt;&amp;#39; dengan url tempat Anda menyimpan JavaScript. (Sudah ada di dalam file example).&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Setelah Anda attach java script seperti pada point no. 1 di atas, maka setiap Anda membuat link akan menampilkan efek pelangi pada saat link itu di sorot. &lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Pada contoh di atas ganti &lt;span style=&quot;color:red;&quot;&gt;www.amirabella-zone.blogspot.com&lt;/span&gt; dengan url link Anda, kemudian ganti &lt;span style=&quot;color:red;&quot;&gt;Nama Link&lt;/span&gt; dengan nama link yang Anda kehendaki.&lt;/i&gt;
    &lt;/li&gt;
   &lt;/ol&gt;
   
  &lt;/div&gt;
  

&lt;/div&gt;
&lt;/div&gt;
 
 &lt;br /&gt;

 &lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px 15px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px 15px;&quot;&gt;

 &lt;div style=&quot;overflow:hidden;text-align:center;background:#EFEFEF;color:white;text-align:center;font-weight:bold;margin:0 0 0px 0;padding:0px 0 0px;border-top:#000 solid 1px;border-bottom:#000 solid 1px;&quot;&gt;
 &lt;h3 style=&quot;text-align:center;&quot;&gt;
  &lt;a href=&quot;http://www.amirabella-zone.blogspot.com&quot;&gt;Silahkan Sorot Link Ini..!!&lt;/a&gt;
 &lt;/h3&gt;
 &lt;/div&gt;
 
 &lt;p style=&quot;background:#5E5E5E;color:white;text-align:center;font-weight:bold;margin:0 0 0 0;padding:5px;border-top:#EFEFEF solid 1px;&quot;&gt;
   &lt;a href=&quot;http://adf.ly/wZtG5&quot; target=&quot;_blank&quot; style=&quot;color:white;text-decoration:none;outline:none;&quot;&gt;Download Example Here&lt;/a&gt;
   &lt;/p&gt;
   
 &lt;/div&gt;

&lt;/ol&gt;

&lt;br /&gt;

&lt;p style=&quot;text-align:justify;margin:15px;border-top:#000 solid 1px;&quot;&gt;&lt;blink&gt;&lt;font style=&quot;color:red;&quot;&gt;&lt;b&gt;Nb.&lt;/b&gt;&lt;/font&gt;&lt;/blink&gt; Silahkan beri &lt;i&gt;feed back&lt;/i&gt; pada kotak komentar di bawah!&lt;/p&gt;
 

&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;</description><link>http://amirabella-zone.blogspot.com/2013/03/cara-membuat-link-pelangi-pada-dokumen.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgl85x4mpBqVapp-7s7B-D3xfL_hqjr5PhMSleZhQy9WytbYX2oPhlBQSOydwz4YViuy2AS0ZnGEoIab-y_RrmjqsAfWenkyZnZmPrtiEj8iY1g5ZP_gBIoDUqt_ixlJwh7sJNF_qUENks/s72-c/RainbowLink.png" height="72" width="72"/><thr:total>0</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-4803429232423009529</guid><pubDate>Fri, 15 Mar 2013 18:40:00 +0000</pubDate><atom:updated>2015-01-24T18:47:43.379+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">HTML</category><title>Cara Membuat Text Pelangi Pada Dokumen HTML</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgugaTaKxl0e-BHKqNr5cpzyi4kr_BH16OS6v8srHGpZYyPqvT00geVeihce9FvDWmi8Sazmhd9NWYjD2hYXIRd0QAJ4ZOhZIk23GwUeFA3rh_NF_j3JtEZ7hQEmqFZbOqc2thKWYbjpHA/s1600/RainbowText.png&quot; imageanchor=&quot;1&quot; style=&quot;clear:left; float:left;margin-right:1em; margin-bottom:1em&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;150&quot; width=&quot;200&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgugaTaKxl0e-BHKqNr5cpzyi4kr_BH16OS6v8srHGpZYyPqvT00geVeihce9FvDWmi8Sazmhd9NWYjD2hYXIRd0QAJ4ZOhZIk23GwUeFA3rh_NF_j3JtEZ7hQEmqFZbOqc2thKWYbjpHA/s320/RainbowText.png&quot; alt=&quot;Cara Membuat Text Pelangi Pada Dokumen HTML&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Pada posting sebelumnya saya share &lt;a href=&quot;http://www.amirabella-zone.blogspot.com/2013/03/cara-membuat-popup-link-pada-dokumen.html&quot;&gt;&lt;i&gt;&amp;#39;Cara Membuat PopUp Link Pada Dokumen HTML&amp;#39;&lt;/i&gt;&lt;/a&gt;, sekarang saya lanjutkan dengan share &lt;a href=&quot;http://www.amirabella-zone.blogspot.com/2013/03/cara-membuat-text-pelangi-pada-dokumen_16.html&quot;&gt;&lt;i&gt;&amp;#39;Cara Membuat Text Pelangi Pada Dokumen HTML&amp;#39;&lt;/i&gt;&lt;/a&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;Text Pelangi&lt;/b&gt; adalah sebuah text &lt;i&gt;(teks)&lt;/i&gt; yang di beri style &lt;i&gt;&amp;#39;rainbow_text&amp;#39;&lt;/i&gt; yang sebenarnya bukanlah termasuk dalam styling normal yang ada di dalam &lt;i&gt;HTML&lt;/i&gt;, melaikan sebuah penambahan &lt;i&gt;style&lt;/i&gt; menggunakan &lt;i&gt;javascript&lt;/i&gt; sehingga membuat dokumen &lt;i&gt;HTML&lt;/i&gt; dapat menampilkan &lt;i&gt;text&lt;/i&gt; dengan efek warna-warni atau yang di sebut dengan &lt;i&gt;&amp;#39;Text Pelangi&amp;#39;&lt;/i&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Baiklah berikut ini cara membuat &lt;b&gt;&lt;i&gt;Text Pelangi&lt;/i&gt;&lt;/b&gt; pada sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;.
&lt;/p&gt;

&lt;br /&gt;

&lt;div&gt;
&lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;Langkah-langkah:&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

&lt;p style=&quot;text-align:justify;margin:15px&quot;&gt;&lt;b&gt;&lt;u&gt;Cara Membuat Text Pelangi Pada Dokumen HTML:&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;

&lt;ol style=&quot;margin-right:15px;&quot;&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;Jalankan aplikasi &lt;i&gt;text editor&lt;/i&gt; seperti &lt;i&gt;&amp;#39;notepad&amp;#39;&lt;/i&gt; untuk menulis sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;. Mungkin &lt;i&gt;notepad&lt;/i&gt; bawaan &lt;i&gt;windows&lt;/i&gt; kurang begitu menarik, solusinya Anda dapat menggunakan aplikasi &lt;i&gt;notepad++&lt;/i&gt; yang dapat Anda download di &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-notepad-63.html&quot; target=&quot;_blank&quot;&gt;sini&lt;/a&gt;.&lt;/li&gt;
 &lt;br /&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;&lt;b&gt;&lt;i&gt;Penting!&lt;/i&gt;&lt;/b&gt; simpan dokumen &lt;i&gt;HTML&lt;/i&gt; dengan format &lt;b&gt;&lt;i&gt;&amp;#39;Nama_File.html&amp;#39;&lt;/i&gt;&lt;/b&gt; tanpa tanda kutip, kemudian pada &lt;i&gt;&amp;#39;Save as type&amp;#39;&lt;/i&gt; Anda pilih &lt;i&gt;&amp;#39;All files&amp;#39;&lt;/i&gt; agar dokumen yang Anda simpan menjadi dokumen &lt;i&gt;HTML&lt;/i&gt; bukan dokumen &lt;i&gt;text biasa&lt;/i&gt;.&lt;/li&gt; 
 &lt;br /&gt; 
 &lt;li style=&quot;text-align:justify&quot;&gt;Sekarang mari kita mulai untuk membuat &lt;i&gt;Text Pelangi&lt;/i&gt; pada dokumen &lt;i&gt;HTML&lt;/i&gt; seperti pada kotak di bawah ini.&lt;/li&gt;
 
 &lt;br /&gt;
 
 &lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;&lt;i&gt;Script Code:&lt;/i&gt;&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

  &lt;font style=&quot;color:#f83ab8;&quot;&gt;&amp;lt;!DOCTYPE html&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;html&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;head&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#59fa38;&quot;&gt;&amp;lt;title&amp;gt;&lt;/font&gt; Cara Membuat Text Pelangi Pada Dokumen HTML &lt;font style=&quot;color:#59fa38;&quot;&gt;&amp;lt;/title&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;br /&gt;
  &amp;lt;script &lt;span style=&quot;color:#586dab;&quot;&gt;src&lt;/span&gt;=&amp;#039;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;js/rainbowtext.js&lt;/span&gt;&amp;#039; type=&amp;#039;text/javascript&amp;#039;&amp;gt;&amp;lt;/script&amp;gt;&lt;br /&gt;
  &lt;br /&gt;
  &lt;font style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;/head&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;

  &lt;font style=&quot;color:#FF6600;&quot;&gt;&amp;lt;body&amp;gt;&lt;/font&gt;
  
&lt;p&gt;&lt;blink&gt;&lt;span style=&quot;color:green;&quot;&gt;&amp;lt;!-- Start Text Pelangi Code --&amp;gt;&lt;/span&gt;&lt;/blink&gt;&lt;/p&gt;
  
 &amp;lt;span &lt;span style=&quot;color:#586dab;&quot;&gt;class&lt;/span&gt;=&amp;quot;rainbow_text&amp;quot;&amp;gt;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Text Pelangi&lt;/span&gt;&amp;lt;/span&amp;gt;
 
&lt;p&gt;&lt;blink&gt;&lt;span style=&quot;color:green;&quot;&gt;&amp;lt;!-- // End Text Pelangi Code --&amp;gt;&lt;/span&gt;&lt;/blink&gt;&lt;/p&gt;
 
  
  &lt;font style=&quot;color:#FF6600;&quot;&gt;&amp;lt;/body&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;/html&amp;gt;&lt;/font&gt;
  
  &lt;p style=&quot;background:#5E5E5E;color:white;text-align:center;font-weight:bold;margin:40px 0 0px 0;padding:5px;border:#000 solid 1px;&quot;&gt;
   Keterangan
   &lt;/p&gt;
  &lt;div style=&quot;background:#EFEFEF;border-left:#000 solid 1px;border-right:#000 solid 1px;border-bottom:#000 solid 1px; padding:10px 5px 0px 0px;&quot;&gt;
   
   &lt;ol&gt;
    &lt;li&gt;
     &lt;i&gt;Sisipkan JavaScript Text Pelangi di atas tag &lt;span style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;/head&amp;gt;&lt;/span&gt; seperti pada code di atas, ganti &amp;#39;&lt;span style=&quot;color:red;&quot;&gt;js/rainbowtext.js&lt;/span&gt;&amp;#39; dengan url tempat Anda menyimpan JavaScript. (Sudah ada di dalam file example).&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Setiap akan membuat text pelangi, Anda gunakan tag &lt;span style=&quot;background:white;&quot;&gt;&amp;lt;span &lt;span style=&quot;color:#586dab;&quot;&gt;class&lt;/span&gt;=&amp;quot;rainbow_text&amp;quot;&amp;gt;&lt;/span&gt; Kemudian jangan untuk menutup tag&amp;#39;nya dengan  &lt;span style=&quot;background:white;&quot;&gt;&amp;lt;/span&amp;gt;&lt;/span&gt;. &lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Pada contoh di atas ganti &lt;span style=&quot;color:red;&quot;&gt;Text Pelangi&lt;/span&gt; dengan content text Anda. &lt;/i&gt;
    &lt;/li&gt;
   &lt;/ol&gt;
   
  &lt;/div&gt;
  

&lt;/div&gt;
&lt;/div&gt;
 
 &lt;br /&gt;

 &lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px 15px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px 15px;&quot;&gt;

 &lt;div style=&quot;overflow:hidden;text-align:center;background:#EFEFEF;color:white;text-align:center;font-weight:bold;margin:0 0 0px 0;padding:0px 0 0px;border-top:#000 solid 1px;border-bottom:#000 solid 1px;&quot;&gt;
 &lt;h3 style=&quot;text-align:center;&quot;&gt;
  &lt;span class=&quot;rainbow_text&quot;&gt;Ini Adalah Contoh Text Pelangi&lt;/span&gt;
 &lt;/h3&gt;
 &lt;/div&gt;
 
 &lt;p style=&quot;background:#5E5E5E;color:white;text-align:center;font-weight:bold;margin:0 0 0 0;padding:5px;border-top:#EFEFEF solid 1px;&quot;&gt;
   &lt;a href=&quot;http://adf.ly/wZsiy&quot; target=&quot;_blank&quot; style=&quot;color:white;text-decoration:none;outline:none;&quot;&gt;Download Example Here&lt;/a&gt;
   &lt;/p&gt;
   
 &lt;/div&gt;

&lt;/ol&gt;

&lt;br /&gt;

&lt;p style=&quot;text-align:justify;margin:15px;border-top:#000 solid 1px;&quot;&gt;&lt;blink&gt;&lt;font style=&quot;color:red;&quot;&gt;&lt;b&gt;Nb.&lt;/b&gt;&lt;/font&gt;&lt;/blink&gt; Silahkan beri &lt;i&gt;feed back&lt;/i&gt; pada kotak komentar di bawah!&lt;/p&gt;
 

&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;</description><link>http://amirabella-zone.blogspot.com/2013/03/cara-membuat-text-pelangi-pada-dokumen_16.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgugaTaKxl0e-BHKqNr5cpzyi4kr_BH16OS6v8srHGpZYyPqvT00geVeihce9FvDWmi8Sazmhd9NWYjD2hYXIRd0QAJ4ZOhZIk23GwUeFA3rh_NF_j3JtEZ7hQEmqFZbOqc2thKWYbjpHA/s72-c/RainbowText.png" height="72" width="72"/><thr:total>0</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-7076111838028343435</guid><pubDate>Mon, 11 Mar 2013 20:19:00 +0000</pubDate><atom:updated>2015-01-24T18:48:24.226+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">HTML</category><title>Cara Membuat PopUp Link Pada Dokumen HTML</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfNYJGdmxq5ltYrFmxtOAdne0D28AbvjPPEADe8cSXcsttsNHUU6LO4YTeLvF3sCJ-6unw28pynWBLm-wkMtO7gTMcNgfo45CP66XGXaIf5klyLxZEsRTMjyKREXbUDLk7w2s0tptqJas/s1600/PopUpLink.png&quot; imageanchor=&quot;1&quot; style=&quot;clear:left; float:left;margin-right:1em; margin-bottom:1em&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;150&quot; width=&quot;200&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfNYJGdmxq5ltYrFmxtOAdne0D28AbvjPPEADe8cSXcsttsNHUU6LO4YTeLvF3sCJ-6unw28pynWBLm-wkMtO7gTMcNgfo45CP66XGXaIf5klyLxZEsRTMjyKREXbUDLk7w2s0tptqJas/s320/PopUpLink.png&quot; alt=&quot;Cara Membuat PopUp Link Pada Dokumen HTML&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Pada posting sebelumnya saya share &lt;a href=&quot;http://www.amirabella-zone.blogspot.com/2013/03/cara-membuat-images-slideshow-pada.html&quot;&gt;&lt;i&gt;&amp;#39;Cara Membuat Images Slideshow Pada Dokumen HTML&amp;#39;&lt;/i&gt;&lt;/a&gt;, sekarang saya lanjutkan dengan share &lt;a href=&quot;http://www.amirabella-zone.blogspot.com/2013/03/cara-membuat-popup-link-pada-dokumen.html&quot;&gt;&lt;i&gt;&amp;#39;Cara Membuat PopUp Link Pada Dokumen HTML&amp;#39;&lt;/i&gt;&lt;/a&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;PopUp Link&lt;/b&gt; adalah sebuah Link &lt;i&gt;(hyperlink)&lt;/i&gt; yang mengarah kepada sebuah halaman web atau URL &lt;i&gt;(Uniform Resource Locator)&lt;/i&gt; tertentu yang ditampilkan pada &lt;i&gt;new windows&lt;/i&gt; yang ukuran dan &lt;i&gt;option&lt;/i&gt; yang ditampilkan di dalam halaman &lt;i&gt;browser&lt;/i&gt; windowsnya sesuai dengan yang telah ditentukan. Sedangkan &lt;b&gt;Link&lt;/b&gt; &lt;i&gt;(hyperlink)&lt;/i&gt; itu sendiri adalah sebuah acuan dalam dokumen hiperteks &lt;i&gt;(hypertext)&lt;/i&gt; ke dokumen yang lain atau sumber lain.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Baiklah berikut ini cara membuat &lt;b&gt;&lt;i&gt;PopUp Link&lt;/i&gt;&lt;/b&gt; pada sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;.
&lt;/p&gt;

&lt;br /&gt;

&lt;div&gt;
&lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;Langkah-langkah:&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

&lt;p style=&quot;text-align:justify;margin:15px&quot;&gt;&lt;b&gt;&lt;u&gt;Cara Membuat PopUp Link Pada Dokumen HTML:&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;

&lt;ol style=&quot;margin-right:15px;&quot;&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;Jalankan aplikasi &lt;i&gt;text editor&lt;/i&gt; seperti &lt;i&gt;&amp;#39;notepad&amp;#39;&lt;/i&gt; untuk menulis sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;. Mungkin &lt;i&gt;notepad&lt;/i&gt; bawaan &lt;i&gt;windows&lt;/i&gt; kurang begitu menarik, solusinya Anda dapat menggunakan aplikasi &lt;i&gt;notepad++&lt;/i&gt; yang dapat Anda download di &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-notepad-63.html&quot; target=&quot;_blank&quot;&gt;sini&lt;/a&gt;.&lt;/li&gt;
 &lt;br /&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;&lt;b&gt;&lt;i&gt;Penting!&lt;/i&gt;&lt;/b&gt; simpan dokumen &lt;i&gt;HTML&lt;/i&gt; dengan format &lt;b&gt;&lt;i&gt;&amp;#39;Nama_File.html&amp;#39;&lt;/i&gt;&lt;/b&gt; tanpa tanda kutip, kemudian pada &lt;i&gt;&amp;#39;Save as type&amp;#39;&lt;/i&gt; Anda pilih &lt;i&gt;&amp;#39;All files&amp;#39;&lt;/i&gt; agar dokumen yang Anda simpan menjadi dokumen &lt;i&gt;HTML&lt;/i&gt; bukan dokumen &lt;i&gt;text biasa&lt;/i&gt;.&lt;/li&gt; 
 &lt;br /&gt; 
 &lt;li style=&quot;text-align:justify&quot;&gt;Sekarang mari kita mulai untuk membuat &lt;i&gt;PopUp Link&lt;/i&gt; pada dokumen &lt;i&gt;HTML&lt;/i&gt; seperti pada kotak di bawah ini.&lt;/li&gt;
 
 &lt;br /&gt;
 
 &lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;&lt;i&gt;Script Code:&lt;/i&gt;&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

  &lt;font style=&quot;color:#f83ab8;&quot;&gt;&amp;lt;!DOCTYPE html&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;html&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;head&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#59fa38;&quot;&gt;&amp;lt;title&amp;gt;&lt;/font&gt; Cara Membuat PopUp Link Pada Dokumen HTML &lt;font style=&quot;color:#59fa38;&quot;&gt;&amp;lt;/title&amp;gt;&lt;/font&gt;&lt;br /&gt;
  
  &lt;font style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;/head&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;

  &lt;font style=&quot;color:#FF6600;&quot;&gt;&amp;lt;body&amp;gt;&lt;/font&gt;
  
&lt;p&gt;&lt;blink&gt;&lt;span style=&quot;color:green;&quot;&gt;&amp;lt;!-- Start PopUp Link Code --&amp;gt;&lt;/span&gt;&lt;/blink&gt;&lt;/p&gt;

&lt;p style=&quot;text-align:left;&quot;&gt;  
 &amp;lt;a href=&amp;quot;#&amp;quot; onClick=&amp;quot;PopUp=window.open(&amp;#039;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;http://www.amirabella-zone.blogspot.com&lt;/span&gt;&amp;#039;, &amp;#039;PopUp&amp;#039;, &amp;#039;toolbar=yes, location=yes, directories=yes, status=yes, menubar=yes, scrollbars=yes, resizable=yes, &lt;span style=&quot;color:#586dab;&quot;&gt;width&lt;/span&gt;=&lt;span style=&quot;color:red;background:yellow;&quot;&gt;600&lt;/span&gt;, &lt;span style=&quot;color:#586dab;&quot;&gt;height&lt;/span&gt;=&lt;span style=&quot;color:red;background:yellow;&quot;&gt;300&lt;/span&gt;&amp;#039;); return false;&amp;quot;&amp;gt;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Nama Link Anda&lt;/span&gt;&amp;lt;/a&amp;gt;
&lt;/p&gt;
 
&lt;p&gt;&lt;blink&gt;&lt;span style=&quot;color:green;&quot;&gt;&amp;lt;!-- // End PopUp Link Code --&amp;gt;&lt;/span&gt;&lt;/blink&gt;&lt;/p&gt;
 
  
  &lt;font style=&quot;color:#FF6600;&quot;&gt;&amp;lt;/body&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;/html&amp;gt;&lt;/font&gt;
  
  &lt;p style=&quot;background:#5E5E5E;color:white;text-align:center;font-weight:bold;margin:40px 0 0px 0;padding:5px;border:#000 solid 1px;&quot;&gt;
   Keterangan
   &lt;/p&gt;
  &lt;div style=&quot;background:#EFEFEF;border-left:#000 solid 1px;border-right:#000 solid 1px;border-bottom:#000 solid 1px; padding:10px 10px 0px 0px;&quot;&gt;
   
   &lt;ol&gt;
    &lt;li&gt;
     &lt;i&gt;Ganti &lt;span style=&quot;color:red;&quot;&gt;http://www.amirabella-zone.blogspot.com&lt;/span&gt; dengan url link Anda.&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Pada attribute width &lt;span style=&quot;color:red;&quot;&gt;600&lt;/span&gt; ganti value atau angkanya sesuai dengan lebar windows yang Anda inginkan. &lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Pada attribute height &lt;span style=&quot;color:red;&quot;&gt;300&lt;/span&gt; ganti value atau angkanya sesuai dengan tinggi windows yang Anda inginkan. &lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Ganti &lt;span style=&quot;color:red;&quot;&gt;Nama Link Anda&lt;/span&gt; sesuai dengan nama yang Anda kehendaki.&lt;/i&gt;
   &lt;/ol&gt;
   
  &lt;/div&gt;
  

&lt;/div&gt;
&lt;/div&gt;
 
 &lt;br /&gt;

 &lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px 15px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px 15px;&quot;&gt;

 &lt;p style=&quot;text-align:center;&quot;&gt;
  &lt;a href=&quot;#&quot; onClick=&quot;PopUp=window.open(&#39;http://www.amirabella-zone.blogspot.com&#39;, &#39;PopUp&#39;, &#39;toolbar=yes, location=yes, directories=yes, status=yes, menubar=yes, scrollbars=yes, resizable=yes, width=600, height=300&#39;); return false;&quot;&gt;Silahkan Klik PopUp Link Ini!&lt;/a&gt; 
 &lt;/p&gt;
 
 &lt;/div&gt;

&lt;/ol&gt;

&lt;br /&gt;

&lt;p style=&quot;text-align:justify;margin:15px;border-top:#000 solid 1px;&quot;&gt;&lt;blink&gt;&lt;font style=&quot;color:red;&quot;&gt;&lt;b&gt;Nb.&lt;/b&gt;&lt;/font&gt;&lt;/blink&gt; Silahkan beri &lt;i&gt;feed back&lt;/i&gt; pada kotak komentar di bawah!&lt;/p&gt;
 

&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;</description><link>http://amirabella-zone.blogspot.com/2013/03/cara-membuat-popup-link-pada-dokumen.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfNYJGdmxq5ltYrFmxtOAdne0D28AbvjPPEADe8cSXcsttsNHUU6LO4YTeLvF3sCJ-6unw28pynWBLm-wkMtO7gTMcNgfo45CP66XGXaIf5klyLxZEsRTMjyKREXbUDLk7w2s0tptqJas/s72-c/PopUpLink.png" height="72" width="72"/><thr:total>0</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-52435737917773533</guid><pubDate>Sat, 09 Mar 2013 22:38:00 +0000</pubDate><atom:updated>2015-02-05T16:38:39.516+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">HTML</category><title>Cara Membuat Images Slideshow Pada Dokumen HTML</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIejrUCbc5gDcBtXuUXTAF18A3ag7B3GHM030fR7RuG72qSXfA2d0zUtPYAW4PedVaqbQNjRpygt5S1KeBfbiodm3R5_f5WSq3h1cGO5TknQCDm2m09_kqLE-65WModBOr0Rx87_UScYU/s1600/ImageSlideshow.gif&quot; imageanchor=&quot;1&quot; style=&quot;clear:left; float:left;margin-right:1em; margin-bottom:1em&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;150&quot; width=&quot;200&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIejrUCbc5gDcBtXuUXTAF18A3ag7B3GHM030fR7RuG72qSXfA2d0zUtPYAW4PedVaqbQNjRpygt5S1KeBfbiodm3R5_f5WSq3h1cGO5TknQCDm2m09_kqLE-65WModBOr0Rx87_UScYU/s320/ImageSlideshow.gif&quot; alt=&quot;Cara Membuat Images Slideshow Pada Dokumen HTML&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Pada posting sebelumnya saya share &lt;a href=&quot;http://www.amirabella-zone.blogspot.com/2013/03/cara-membuat-link-gambar-berjalan-pada.html&quot;&gt;&lt;i&gt;&amp;#39;Cara Membuat Link Gambar Berjalan Pada Dokumen HTML&amp;#39;&lt;/i&gt;&lt;/a&gt;, sekarang saya lanjutkan dengan share &lt;a href=&quot;http://www.amirabella-zone.blogspot.com/2013/03/cara-membuat-images-slideshow-pada.html&quot;&gt;&lt;i&gt;&amp;#39;Cara Membuat Images Slideshow Pada Dokumen HTML&amp;#39;&lt;/i&gt;&lt;/a&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;Images Slideshow&lt;/b&gt; adalah sekumpulan images &lt;i&gt;(file gambar)&lt;/i&gt; yang terdiri dari dua file gambar atau lebih yang dikombinasikan dengan penggunaan &lt;i&gt;Javascript&lt;/i&gt; serta CSS &lt;i&gt;(cascading style sheet)&lt;/i&gt; sehingga membentuk sebuah tampilan gambar yang dapat berganti-ganti &lt;i&gt;(slideshow)&lt;/i&gt; yang waktu pergantian dari gambar satu ke gambar berikutnya &lt;i&gt;(timing)&lt;/i&gt; sesuai dengan yang telah di atur dalam &lt;i&gt;script&amp;#39;nya&lt;/i&gt;. 
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;
Artikel terkait: &lt;a href=&quot;http://www.amirabella-zone.blogspot.com/2015/02/cara-membuat-images-slider-tanpa-jquery.html&quot; target=&quot;_blank&quot;&gt;Cara Membuat Images Slider Tanpa Jquery&lt;/a&gt;
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Baiklah berikut ini cara membuat &lt;b&gt;&lt;i&gt;Images Slideshow&lt;/i&gt;&lt;/b&gt; pada sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;.
&lt;/p&gt;

&lt;br /&gt;

&lt;div&gt;
&lt;div style=&quot;margin-bottom: 10px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;&lt;u&gt;Langkah-langkah:&lt;/u&gt;&lt;/b&gt;&lt;/span&gt;
&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;&quot;&gt;
&lt;div&gt;

&lt;p style=&quot;text-align:justify;margin:15px&quot;&gt;&lt;b&gt;&lt;u&gt;Cara Membuat Images Slideshow Pada Dokumen HTML:&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;

&lt;ol style=&quot;margin-right:15px;&quot;&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;Jalankan aplikasi &lt;i&gt;text editor&lt;/i&gt; seperti &lt;i&gt;&amp;#39;notepad&amp;#39;&lt;/i&gt; untuk menulis sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;. Mungkin &lt;i&gt;notepad&lt;/i&gt; bawaan &lt;i&gt;windows&lt;/i&gt; kurang begitu menarik, solusinya Anda dapat menggunakan aplikasi &lt;i&gt;notepad++&lt;/i&gt; yang dapat Anda download &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-notepad-63.html&quot; target=&quot;_blank&quot;&gt;di sini&lt;/a&gt;.&lt;/li&gt;
 &lt;br /&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;&lt;b&gt;&lt;i&gt;Penting!&lt;/i&gt;&lt;/b&gt; simpan dokumen &lt;i&gt;HTML&lt;/i&gt; dengan format &lt;b&gt;&lt;i&gt;&amp;#39;Nama_File.html&amp;#39;&lt;/i&gt;&lt;/b&gt; tanpa tanda kutip, kemudian pada &lt;i&gt;&amp;#39;Save as type&amp;#39;&lt;/i&gt; Anda pilih &lt;i&gt;&amp;#39;All files&amp;#39;&lt;/i&gt; agar dokumen yang Anda simpan menjadi dokumen &lt;i&gt;HTML&lt;/i&gt; bukan dokumen &lt;i&gt;text biasa&lt;/i&gt;.&lt;/li&gt; 
 &lt;br /&gt; 
 &lt;li style=&quot;text-align:justify&quot;&gt;Sekarang mari kita mulai untuk membuat &lt;i&gt;Images Slideshow&lt;/i&gt; pada dokumen &lt;i&gt;HTML&lt;/i&gt; seperti pada kotak di bawah ini.&lt;/li&gt;
 
 &lt;br /&gt;
 
 &lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;&lt;i&gt;Script Code:&lt;/i&gt;&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

  &lt;font style=&quot;color:#f83ab8;&quot;&gt;&amp;lt;!DOCTYPE html&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;html&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;head&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#59fa38;&quot;&gt;&amp;lt;title&amp;gt;&lt;/font&gt; Cara Membuat Images Slideshow Pada Dokumen HTML &lt;font style=&quot;color:#59fa38;&quot;&gt;&amp;lt;/title&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;br /&gt;
  &amp;lt;link rel=&amp;quot;stylesheet&amp;quot; type=&amp;quot;text/css&amp;quot; &lt;span style=&quot;color:#586dab;&quot;&gt;href&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;css/style.css&lt;/span&gt;&amp;quot; /&amp;gt;&lt;br /&gt;
  &amp;lt;script &lt;span style=&quot;color:#586dab;&quot;&gt;src&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;js/jquery-min.js&lt;/span&gt;&amp;quot; type=&amp;quot;text/javascript&amp;quot;&amp;gt;&amp;lt;/script&amp;gt;&lt;br /&gt;
  &amp;lt;script &lt;span style=&quot;color:#586dab;&quot;&gt;src&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;js/s3slider.js&lt;/span&gt;&amp;quot; type=&amp;quot;text/javascript&amp;quot;&amp;gt;&amp;lt;/script&amp;gt;&lt;br /&gt;
  &amp;lt;script type=&amp;quot;text/javascript&amp;quot;&amp;gt;&lt;br /&gt;
  $(document).ready(function() {&lt;br /&gt;
        $(&amp;#039;#slider&amp;#039;).s3Slider({&lt;br /&gt;
    timeOut: 3000&lt;br /&gt;
    });&lt;br /&gt;
   });&lt;br /&gt;
  &amp;lt;/script&amp;gt;&lt;br /&gt;
  &lt;br /&gt;
  &lt;font style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;/head&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;

  &lt;font style=&quot;color:#FF6600;&quot;&gt;&amp;lt;body&amp;gt;&lt;/font&gt;
  
&lt;p&gt;&lt;blink&gt;&lt;span style=&quot;color:green;&quot;&gt;&amp;lt;!-- start images slideshow --&amp;gt;&lt;/span&gt;&lt;/blink&gt;&lt;/p&gt;
 &amp;lt;div id=&amp;quot;slider&amp;quot;&amp;gt;&lt;br /&gt;
        &amp;lt;ul id=&amp;quot;sliderContent&amp;quot;&amp;gt;&lt;br /&gt;
            &amp;lt;li class=&amp;quot;sliderImage&amp;quot;&amp;gt;&lt;br /&gt;
                &amp;lt;a &lt;span style=&quot;color:#586dab;&quot;&gt;href&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;http://www.amirabella-zone.blogspot.com&lt;/span&gt;&amp;quot; &lt;span style=&quot;color:#586dab;&quot;&gt;target&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;_blank&lt;/span&gt;&amp;quot; style=&amp;quot;outline:none;&amp;quot;&amp;gt;&amp;lt;img &lt;span style=&quot;color:#586dab;&quot;&gt;src&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;images/1.jpg&lt;/span&gt;&amp;quot; alt=&amp;quot;1&amp;quot; style=&amp;quot;border:0;&amp;quot;/&amp;gt;&amp;lt;/a&amp;gt;&lt;br /&gt;
                &amp;lt;span class=&amp;quot;top&amp;quot;&amp;gt;&amp;lt;strong&amp;gt;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Title text 1&lt;/span&gt;&amp;lt;/strong&amp;gt;&amp;lt;br /&amp;gt;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Content text...&lt;/span&gt;&amp;lt;/span&amp;gt;&lt;br /&gt;
            &amp;lt;/li&amp;gt;&lt;br /&gt;
            &amp;lt;li class=&amp;quot;sliderImage&amp;quot;&amp;gt;&lt;br /&gt;
                &amp;lt;a &lt;span style=&quot;color:#586dab;&quot;&gt;href&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;http://www.amirabella-zone.blogspot.com&lt;/span&gt;&amp;quot; &lt;span style=&quot;color:#586dab;&quot;&gt;target&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;_blank&lt;/span&gt;&amp;quot; style=&amp;quot;outline:none;&amp;quot;&amp;gt;&amp;lt;img &lt;span style=&quot;color:#586dab;&quot;&gt;src&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;images/2.jpg&lt;/span&gt;&amp;quot; alt=&amp;quot;2&amp;quot; style=&amp;quot;border:0;&amp;quot; /&amp;gt;&amp;lt;/a&amp;gt;&lt;br /&gt;
                &amp;lt;span class=&amp;quot;top&amp;quot;&amp;gt;&amp;lt;strong&amp;gt;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Title text 2&lt;/span&gt;&amp;lt;/strong&amp;gt;&amp;lt;br /&amp;gt;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Content text...&lt;/span&gt;&amp;lt;/span&amp;gt;&lt;br /&gt;
            &amp;lt;/li&amp;gt;&lt;br /&gt;
            &amp;lt;li class=&amp;quot;sliderImage&amp;quot;&amp;gt;&lt;br /&gt;
                &amp;lt;a &lt;span style=&quot;color:#586dab;&quot;&gt;href&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;http://www.amirabella-zone.blogspot.com&lt;/span&gt;&amp;quot; &lt;span style=&quot;color:#586dab;&quot;&gt;target&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;_blank&lt;/span&gt;&amp;quot; style=&amp;quot;outline:none;&amp;quot;&amp;gt;&amp;lt;img &lt;span style=&quot;color:#586dab;&quot;&gt;src&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;images/3.jpg&lt;/span&gt;&amp;quot; alt=&amp;quot;3&amp;quot; style=&amp;quot;border:0;&amp;quot; /&amp;gt;&amp;lt;/a&amp;gt;&lt;br /&gt;
                &amp;lt;span class=&amp;quot;bottom&amp;quot;&amp;gt;&amp;lt;strong&amp;gt;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Title text 3&lt;/span&gt;&amp;lt;/strong&amp;gt;&amp;lt;br /&amp;gt;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Content text...&lt;/span&gt;&amp;lt;/span&amp;gt;&lt;br /&gt;
            &amp;lt;/li&amp;gt;&lt;br /&gt;
            &amp;lt;li class=&amp;quot;sliderImage&amp;quot;&amp;gt;&lt;br /&gt;
                &amp;lt;a &lt;span style=&quot;color:#586dab;&quot;&gt;href&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;http://www.amirabella-zone.blogspot.com&lt;/span&gt;&amp;quot; &lt;span style=&quot;color:#586dab;&quot;&gt;target&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;_blank&lt;/span&gt;&amp;quot; style=&amp;quot;outline:none;&amp;quot;&amp;gt;&amp;lt;img &lt;span style=&quot;color:#586dab;&quot;&gt;src&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;images/4.jpg&lt;/span&gt;&amp;quot; alt=&amp;quot;4&amp;quot; style=&amp;quot;border:0;&amp;quot; /&amp;gt;&amp;lt;/a&amp;gt;&lt;br /&gt;
                &amp;lt;span class=&amp;quot;bottom&amp;quot;&amp;gt;&amp;lt;strong&amp;gt;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Title text 4&lt;/span&gt;&amp;lt;/strong&amp;gt;&amp;lt;br /&amp;gt;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Content text...&lt;/span&gt;&amp;lt;/span&amp;gt;&lt;br /&gt;
            &amp;lt;/li&amp;gt;&lt;br /&gt;
            &amp;lt;li class=&amp;quot;sliderImage&amp;quot;&amp;gt;&lt;br /&gt;
                &amp;lt;a &lt;span style=&quot;color:#586dab;&quot;&gt;href&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;http://www.amirabella-zone.blogspot.com&lt;/span&gt;&amp;quot; &lt;span style=&quot;color:#586dab;&quot;&gt;target&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;_blank&lt;/span&gt;&amp;quot; style=&amp;quot;outline:none;&amp;quot;&amp;gt;&amp;lt;img &lt;span style=&quot;color:#586dab;&quot;&gt;src&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;images/5.jpg&lt;/span&gt;&amp;quot; alt=&amp;quot;5&amp;quot; style=&amp;quot;border:0;&amp;quot; /&amp;gt;&amp;lt;/a&amp;gt;&lt;br /&gt;
                &amp;lt;span class=&amp;quot;top&amp;quot;&amp;gt;&amp;lt;strong&amp;gt;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Title text 5&lt;/span&gt;&amp;lt;/strong&amp;gt;&amp;lt;br /&amp;gt;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Content text...&lt;/span&gt;&amp;lt;/span&amp;gt;&lt;br /&gt;
            &amp;lt;/li&amp;gt;&lt;br /&gt;
            &amp;lt;div class=&amp;quot;clear sliderImage&amp;quot;&amp;gt;&amp;lt;/div&amp;gt;&lt;br /&gt;
        &amp;lt;/ul&amp;gt;&lt;br /&gt;
    &amp;lt;/div&amp;gt;&lt;br /&gt;
&lt;p&gt;&lt;blink&gt;&lt;span style=&quot;color:green;&quot;&gt;&amp;lt;!-- // end images slideshow --&amp;gt;&lt;/span&gt;&lt;/blink&gt;&lt;/p&gt;

&lt;/p&gt;
  
  
  &lt;font style=&quot;color:#FF6600;&quot;&gt;&amp;lt;/body&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;/html&amp;gt;&lt;/font&gt;
  
  &lt;p style=&quot;background:#5E5E5E;color:white;text-align:center;font-weight:bold;margin:40px 0 0px 0;padding:5px;border:#000 solid 1px;&quot;&gt;
   Keterangan
   &lt;/p&gt;
  &lt;div style=&quot;background:#EFEFEF;border-left:#000 solid 1px;border-right:#000 solid 1px;border-bottom:#000 solid 1px;&quot;&gt;
   &lt;div style=&quot;height:5px;&quot;&gt;&lt;/div&gt;
   &lt;ol&gt;
    &lt;li&gt;
     &lt;i&gt;Ganti &lt;span style=&quot;color:red;&quot;&gt;css/style.css&lt;/span&gt; dengan url tempat Anda menyimpan file css images slideshow (sudah ada di dalam file example).&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Ganti &lt;span style=&quot;color:red;&quot;&gt;js/jquery-min.js&lt;/span&gt; dengan url tempat Anda menyimpan file jquery-min.js (sudah ada di dalam file example).&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Ganti &lt;span style=&quot;color:red;&quot;&gt;js/s3slider.js&lt;/span&gt; dengan url tempat Anda menyimpan file s3slider.js (sudah ada di dalam file example).&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Ganti &lt;span style=&quot;color:red;&quot;&gt;http://www.amirabella-zone.blogspot.com&lt;/span&gt; dengan url link Anda.&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Pada attribute target &lt;span style=&quot;color:red;&quot;&gt;_blank&lt;/span&gt; artinya target link akan ditampilkan pada tab baru apabila Anda menginginkan targetnya pada halaman yang sama maka ganti valuenya dengan &lt;span style=&quot;color:red;&quot;&gt;_self&lt;/span&gt;, atau dapat jg dengan menghapus attribute &lt;span style=&quot;color:red;&quot;&gt;target=&quot;_blank&quot;&lt;/span&gt;. &lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Ganti &lt;span style=&quot;color:red;&quot;&gt;images/1.jpg&lt;/span&gt;, &lt;span style=&quot;color:red;&quot;&gt;images/2.jpg&lt;/span&gt;, &lt;span style=&quot;color:red;&quot;&gt;images/3.jpg&lt;/span&gt;, &lt;span style=&quot;color:red;&quot;&gt;images/4.jpg&lt;/span&gt;, &lt;span style=&quot;color:red;&quot;&gt;images/5.jpg&lt;/span&gt; dengan url file images (gambar) Anda.&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Ganti &lt;span style=&quot;color:red;&quot;&gt;Title text 1&lt;/span&gt;, &lt;span style=&quot;color:red;&quot;&gt;Title text 2&lt;/span&gt;, &lt;span style=&quot;color:red;&quot;&gt;Title text 3&lt;/span&gt;, &lt;span style=&quot;color:red;&quot;&gt;Title text 4&lt;/span&gt;, &lt;span style=&quot;color:red;&quot;&gt;Title text 5&lt;/span&gt; dengan Title yang Anda inginkan.&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Ganti &lt;span style=&quot;color:red;&quot;&gt;Content text...&lt;/span&gt;, dengan content text Anda.&lt;/i&gt;
    &lt;/li&gt;
   &lt;/ol&gt;
   &lt;div style=&quot;height:5px;&quot;&gt;&lt;/div&gt;
  &lt;/div&gt;
  

&lt;/div&gt;
&lt;/div&gt;
 
 &lt;br /&gt;

&lt;div style=&quot;border-top:#000 dotted 1px;&quot;&gt;&amp;nbsp;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Baca juga: &lt;a href=&quot;http://amirabella-zone.blogspot.com/2015/01/cara-memasukkan-playlist-lagu-pada.html&quot; target=&quot;_blank&quot;&gt;Cara Memasukkan Playlist Lagu Pada Dokumen HTML&lt;/a&gt;
&lt;/p&gt;

 &lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px 15px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px 15px;&quot;&gt;

 &lt;p style=&quot;background:#5E5E5E;color:white;text-align:center;font-weight:bold;margin:0 0 0px 0;padding:5px;border-bottom:#EFEFEF solid 1px;&quot;&gt;
   Screenshot Images Slideshow
   &lt;/p&gt;
&lt;div style=&quot;height:300px;overflow:hidden;text-align:center;background:#EFEFEF;color:white;text-align:center;font-weight:bold;margin:0 0 0px 0;padding:0px 0 0px;border-top:#000 solid 1px;border-bottom:#000 solid 1px;&quot;&gt;   

&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgO1zSTmQlK_1Br5Hzztr134QT9SOiAsaPJ9dAZvvsaSrbyAdy_herRGlp_0PQg_BnnbTDZRPctpLSEFiRF5sYhuv7YDu8tfFFX4lN17mukp8sGsYBZfCH_kzoomNBFK_iyHT_vN6P-Dco/s1600/SS_ImagesSlideShow.gif&quot; imageanchor=&quot;1&quot; &gt;&lt;img border=&quot;0&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgO1zSTmQlK_1Br5Hzztr134QT9SOiAsaPJ9dAZvvsaSrbyAdy_herRGlp_0PQg_BnnbTDZRPctpLSEFiRF5sYhuv7YDu8tfFFX4lN17mukp8sGsYBZfCH_kzoomNBFK_iyHT_vN6P-Dco/s1600/SS_ImagesSlideShow.gif&quot; /&gt;&lt;/a&gt;

&lt;/div&gt;
&lt;p style=&quot;background:#5E5E5E;color:white;text-align:center;font-weight:bold;margin:0 0 0 0;padding:5px;border-top:#EFEFEF solid 1px;&quot;&gt;
   &lt;a href=&quot;http://adf.ly/wZrWu&quot; target=&quot;_blank&quot; style=&quot;color:white;text-decoration:none;outline:none;&quot;&gt;Download Example Here&lt;/a&gt;
   &lt;/p&gt;
    
 &lt;/div&gt;

&lt;/ol&gt;

&lt;br /&gt;

&lt;p style=&quot;text-align:justify;margin:15px;border-top:#000 solid 1px;&quot;&gt;&lt;blink&gt;&lt;font style=&quot;color:red;&quot;&gt;&lt;b&gt;Nb.&lt;/b&gt;&lt;/font&gt;&lt;/blink&gt; Silahkan beri &lt;i&gt;feed back&lt;/i&gt; pada kotak komentar di bawah!&lt;/p&gt;
 

&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;</description><link>http://amirabella-zone.blogspot.com/2013/03/cara-membuat-images-slideshow-pada.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIejrUCbc5gDcBtXuUXTAF18A3ag7B3GHM030fR7RuG72qSXfA2d0zUtPYAW4PedVaqbQNjRpygt5S1KeBfbiodm3R5_f5WSq3h1cGO5TknQCDm2m09_kqLE-65WModBOr0Rx87_UScYU/s72-c/ImageSlideshow.gif" height="72" width="72"/><thr:total>0</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-8499507242952347480</guid><pubDate>Wed, 06 Mar 2013 14:57:00 +0000</pubDate><atom:updated>2015-01-24T18:49:40.555+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">HTML</category><title>Cara Membuat Link Gambar Berjalan Pada Dokumen HTML</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhACgpy9odqqOJdXVrYcNjIzow38Vks0m9mDhn3-0kTrbzB1pYx-6e4X99racM8THNBUD1m03vJo7Gs5qPhwVGkfvc7HZELsbpzF_HBKgLpbzGAQ7l37IxYMDqYpvPcFh01xq2dEreww9g/s1600/MarqueeImagesLink.png&quot; imageanchor=&quot;1&quot; style=&quot;clear:left; float:left;margin-right:1em; margin-bottom:1em&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;150&quot; width=&quot;200&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhACgpy9odqqOJdXVrYcNjIzow38Vks0m9mDhn3-0kTrbzB1pYx-6e4X99racM8THNBUD1m03vJo7Gs5qPhwVGkfvc7HZELsbpzF_HBKgLpbzGAQ7l37IxYMDqYpvPcFh01xq2dEreww9g/s320/MarqueeImagesLink.png&quot; alt=&quot;Cara Membuat Link Gambar Berjalan Pada Dokumen HTML&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Pada posting sebelumnya saya share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-adobe-creative-suite-cs2-full.html&quot;&gt;&lt;i&gt;&amp;#39;Adobe Creative Suite CS2 Full Serial&amp;#39;&lt;/i&gt;&lt;/a&gt;, sekarang saya lanjutkan dengan share &lt;a href=&quot;http://www.amirabella-zone.blogspot.com/2013/03/cara-membuat-link-gambar-berjalan-pada.html&quot;&gt;&lt;i&gt;&amp;#39;Cara Membuat Link Gambar Berjalan Pada Dokumen HTML&amp;#39;&lt;/i&gt;&lt;/a&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;Link Gambar Berjalan&lt;/b&gt; adalah sebuah link dalam bentuk gambar yang dikombinasikan dengan &lt;i&gt;&amp;#39;tag marquee&amp;#39;&lt;/i&gt; sehingga membentuk sebuah link yang berupa gambar berjalan &lt;i&gt;(Images Link with Marquee)&lt;/i&gt;. Fungsi dari &lt;i&gt;Link Gambar Berjalan&lt;/i&gt; ini yaitu untuk membuat atau menyusun beberapa link agar tampak lebih menarik. Tujuannya adalah untuk mendapatkan perhatian orang yang melihatnya sekaligus mempercantik tampilan &lt;i&gt;(layout)&lt;/i&gt; dokumen HTML yang kita buat. 
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Baiklah berikut ini cara membuat &lt;b&gt;&lt;i&gt;Link Gambar Berjalan&lt;/i&gt;&lt;/b&gt; pada sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;.
&lt;/p&gt;

&lt;br /&gt;

&lt;div&gt;
&lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;Langkah-langkah:&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

&lt;p style=&quot;text-align:justify;margin:15px&quot;&gt;&lt;b&gt;&lt;u&gt;Cara Membuat Link Gambar Berjalan Pada Dokumen HTML:&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;

&lt;ol style=&quot;margin-right:15px;&quot;&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;Jalankan aplikasi &lt;i&gt;text editor&lt;/i&gt; seperti &lt;i&gt;&amp;#39;notepad&amp;#39;&lt;/i&gt; untuk menulis sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;. Mungkin &lt;i&gt;notepad&lt;/i&gt; bawaan &lt;i&gt;windows&lt;/i&gt; kurang begitu menarik, solusinya Anda dapat menggunakan aplikasi &lt;i&gt;notepad++&lt;/i&gt; yang dapat Anda download di &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-notepad-63.html&quot; target=&quot;_blank&quot;&gt;sini&lt;/a&gt;.&lt;/li&gt;
 &lt;br /&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;&lt;b&gt;&lt;i&gt;Penting!&lt;/i&gt;&lt;/b&gt; simpan dokumen &lt;i&gt;HTML&lt;/i&gt; dengan format &lt;b&gt;&lt;i&gt;&amp;#39;Nama_File.html&amp;#39;&lt;/i&gt;&lt;/b&gt; tanpa tanda kutip, kemudian pada &lt;i&gt;&amp;#39;Save as type&amp;#39;&lt;/i&gt; Anda pilih &lt;i&gt;&amp;#39;All files&amp;#39;&lt;/i&gt; agar dokumen yang Anda simpan menjadi dokumen &lt;i&gt;HTML&lt;/i&gt; bukan dokumen &lt;i&gt;text biasa&lt;/i&gt;.&lt;/li&gt; 
 &lt;br /&gt; 
 &lt;li style=&quot;text-align:justify&quot;&gt;Sekarang mari kita mulai untuk membuat &lt;i&gt;Link Gambar Berjalan&lt;/i&gt; pada dokumen &lt;i&gt;HTML&lt;/i&gt; seperti pada kotak di bawah ini.&lt;/li&gt;
 
 &lt;br /&gt;
 
 &lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;&lt;i&gt;Script Code:&lt;/i&gt;&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

  &lt;font style=&quot;color:#f83ab8;&quot;&gt;&amp;lt;!DOCTYPE html&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;html&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;head&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#59fa38;&quot;&gt;&amp;lt;title&amp;gt;&lt;/font&gt; Cara Membuat Link Gambar Berjalan Pada Dokumen HTML &lt;font style=&quot;color:#59fa38;&quot;&gt;&amp;lt;/title&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;/head&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;

  &lt;font style=&quot;color:#FF6600;&quot;&gt;&amp;lt;body&amp;gt;&lt;/font&gt;
  
  &lt;p&gt;&lt;blink&gt;&lt;span style=&quot;color:green;&quot;&gt;&amp;lt;!-- Di bawah ini adalah script link gambar berjalan --&amp;gt;&lt;/span&gt;&lt;/blink&gt; &lt;br /&gt;
  &amp;lt;marquee &lt;span style=&quot;color:#586dab;&quot;&gt;behavior&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;alternate&lt;/span&gt;&amp;quot; &lt;span style=&quot;color:#586dab;&quot;&gt;direction&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;left&lt;/span&gt;&amp;quot; &lt;span style=&quot;color:#586dab;&quot;&gt;scrollamount&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;3&lt;/span&gt;&amp;quot; onmouseover=&amp;quot;stop();&amp;quot; onmouseout=&amp;quot;start();&amp;quot;&amp;gt;&lt;br /&gt;

&amp;lt;span style=&amp;quot;padding: 0px;&amp;quot;&amp;gt;&lt;br /&gt;
 &amp;lt;a &lt;span style=&quot;color:#586dab;&quot;&gt;href&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Link_1&lt;/span&gt;&amp;quot; target=&amp;quot;_blank&amp;quot; style=&amp;quot;text-decoration:none;outline:none;&amp;quot; &lt;span style=&quot;color:#586dab;&quot;&gt;title&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Title_1&lt;/span&gt;&amp;quot;&amp;gt;&lt;br /&gt;
  &amp;lt;img &lt;span style=&quot;color:#586dab;&quot;&gt;src&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Gambar_1&lt;/span&gt;&amp;quot; border=&amp;quot;0&amp;quot;&amp;gt;&lt;br /&gt;
 &amp;lt;/a&amp;gt;&lt;br /&gt;
&amp;lt;/span&amp;gt;&lt;br /&gt;
&amp;lt;span style=&amp;quot;padding: 0px;&amp;quot;&amp;gt;&lt;br /&gt;
 &amp;lt;a &lt;span style=&quot;color:#586dab;&quot;&gt;href&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Link_2&lt;/span&gt;&amp;quot; target=&amp;quot;_blank&amp;quot; style=&amp;quot;text-decoration:none;outline:none;&amp;quot; &lt;span style=&quot;color:#586dab;&quot;&gt;title&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Title_2&lt;/span&gt;&amp;quot;&amp;gt;&lt;br /&gt;
  &amp;lt;img &lt;span style=&quot;color:#586dab;&quot;&gt;src&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Gambar_2&lt;/span&gt;&amp;quot; border=&amp;quot;0&amp;quot;&amp;gt;&lt;br /&gt;
 &amp;lt;/a&amp;gt;&lt;br /&gt;
&amp;lt;/span&amp;gt;&lt;br /&gt;
&amp;lt;span style=&amp;quot;padding: 0px;&amp;quot;&amp;gt;&lt;br /&gt;
 &amp;lt;a &lt;span style=&quot;color:#586dab;&quot;&gt;href&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Link_3&lt;/span&gt;&amp;quot; target=&amp;quot;_blank&amp;quot; style=&amp;quot;text-decoration:none;outline:none;&amp;quot; &lt;span style=&quot;color:#586dab;&quot;&gt;title&lt;/span&gt;=&amp;quot;Title_3&amp;quot;&amp;gt;&lt;br /&gt;
  &amp;lt;img &lt;span style=&quot;color:#586dab;&quot;&gt;src&lt;/span&gt;=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;Gambar_3&lt;/span&gt;&amp;quot; border=&amp;quot;0&amp;quot;&amp;gt;&lt;br /&gt;
 &amp;lt;/a&amp;gt;&lt;br /&gt;
&amp;lt;/span&amp;gt;&lt;br /&gt;

&amp;lt;/marquee&amp;gt;&lt;br /&gt;
&lt;blink&gt;&lt;span style=&quot;color:green;&quot;&gt;&amp;lt;!-- // Akhir dari script link gambar berjalan --&amp;gt;&lt;/span&gt;&lt;/blink&gt;

&lt;/p&gt;
  
  
  &lt;font style=&quot;color:#FF6600;&quot;&gt;&amp;lt;/body&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;/html&amp;gt;&lt;/font&gt;
  
  &lt;p style=&quot;background:#5E5E5E;color:white;text-align:center;font-weight:bold;margin:40px 0 0px 0;padding:5px;border:#000 solid 1px;&quot;&gt;
   Keterangan
   &lt;/p&gt;
&lt;div style=&quot;background:#EFEFEF;border-left:#000 solid 1px;border-right:#000 solid 1px;border-bottom:#000 solid 1px;&quot;&gt;
&lt;div style=&quot;height:10px;&quot;&gt;&lt;/div&gt;   
&lt;ol&gt;
    &lt;li&gt;
     &lt;i&gt;Ganti &lt;span style=&quot;color:red;&quot;&gt;Link_1&lt;/span&gt;, &lt;span style=&quot;color:red;&quot;&gt;Link_2&lt;/span&gt;, dan &lt;span style=&quot;color:red;&quot;&gt;Link_3&lt;/span&gt; dengan &amp;#39;link&amp;#39; Anda.&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Ganti &lt;span style=&quot;color:red;&quot;&gt;Title_1&lt;/span&gt;, &lt;span style=&quot;color:red;&quot;&gt;Title_2&lt;/span&gt;, dan &lt;span style=&quot;color:red;&quot;&gt;Title_3&lt;/span&gt; dengan &amp;#39;Title&amp;#39; Anda.&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Ganti &lt;span style=&quot;color:red;&quot;&gt;Gambar_1&lt;/span&gt;, &lt;span style=&quot;color:red;&quot;&gt;Gambar_2&lt;/span&gt;, dan &lt;span style=&quot;color:red;&quot;&gt;Gambar_3&lt;/span&gt; dengan &amp;#39;File Gambar&amp;#39; Anda.&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Pada attribute &lt;span style=&quot;color:red;&quot;&gt;behavior&lt;/span&gt;, Anda dapat merubahnya dengan &amp;#39;&lt;span style=&quot;color:red;&quot;&gt;scroll&lt;/span&gt; atau &lt;span style=&quot;color:red;&quot;&gt;slide&lt;/span&gt;&amp;#39;.&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Pada attribute &lt;span style=&quot;color:red;&quot;&gt;direction&lt;/span&gt;, Anda dapat merubahnya dengan &amp;#39;&lt;span style=&quot;color:red;&quot;&gt;right&lt;/span&gt;, &lt;span style=&quot;color:red;&quot;&gt;down&lt;/span&gt;&amp;#39;, atau &lt;span style=&quot;color:red;&quot;&gt;up&lt;/span&gt;&amp;#39;.&lt;/i&gt;
    &lt;/li&gt;
    &lt;li&gt;
     &lt;i&gt;Pada attribute &lt;span style=&quot;color:red;&quot;&gt;scrollamount&lt;/span&gt;, Anda dapat merubah value&amp;#39;nya dengan angka yang Anda inginkan.&lt;/i&gt;
    &lt;/li&gt;
   &lt;/ol&gt;
&lt;/div&gt;  

&lt;/div&gt;
&lt;/div&gt;
 
 &lt;br /&gt;

 &lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px 15px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px 15px;&quot;&gt;

 &lt;p style=&quot;background:#5E5E5E;color:white;text-align:center;font-weight:bold;margin:0 0 0px 0;padding:5px;border-bottom:#EFEFEF solid 1px;&quot;&gt;
   Contoh Link Gambar Berjalan
   &lt;/p&gt;

&lt;div style=&quot;height:155px;background:#EFEFEF;color:white;text-align:center;font-weight:bold;margin:0 0 0px 0;padding:5px 0 0;border-top:#000 solid 1px;border-bottom:#000 solid 1px;overflow:hidden&quot;&gt;  
 
&lt;marquee behavior=&quot;alternate&quot; direction=&quot;left&quot; scrollamount=&quot;3&quot; onmouseover=&quot;stop();&quot; onmouseout=&quot;start();&quot;&gt;

 &lt;a href=&quot;http://amirabella-zone.blogspot.com/2012/10/apa-itu-html.html&quot; target=&quot;_blank&quot; style=&quot;text-decoration:none;outline:none;&quot; title=&quot;Apa Itu HTML?&quot;&gt;
  &lt;img src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEioLeGSddEWjNibM9iKbenVwxBhHJsPkg2EsEwXJ6aunQYDiKxS0kLU48oEkfLMGTJ40zc2njbl8MOIz1t4XtrDTu5dQaFQEJaJzXYeUocTKT0Cp7cW8ch67RKREBrpz3MdIOdTuY-3k0k/s1600/HTML.png&quot; border=&quot;0&quot; alt=&quot;Apa Itu HTML?&quot;&gt;
 &lt;/a&gt;

&lt;span style=&quot;padding: 0px;&quot;&gt;
 &lt;a href=&quot;http://amirabella-zone.blogspot.com/2012/11/cara-membuat-link-pada-dokumen-html.html&quot; target=&quot;_blank&quot; style=&quot;text-decoration:none;outline:none;&quot; title=&quot;Cara Membuat Link Pada Dokumen HTML&quot;&gt;
  &lt;img src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikKarik2jxkl6rcURchhdmEuGgrQUPSzr7lSzS9LY7j9UDDL85O96tKnv6ScB221dkyJHHZ3awBHyoRgIvwtCMoHfBPQx8vUo3ZDXEvqhGvxE_rGVyA4ous-UrEpgtBjunt_X2Ox7gigg/s1600/Link.png&quot; border=&quot;0&quot; alt=&quot;Cara Membuat Link Pada Dokumen HTML&quot;&gt;
 &lt;/a&gt;
&lt;/span&gt;
&lt;span style=&quot;padding: 0px;&quot;&gt;
 &lt;a href=&quot;http://amirabella-zone.blogspot.com/2012/11/cara-membuat-list-pada-dokumen-html.html&quot; target=&quot;_blank&quot; style=&quot;text-decoration:none;outline:none;&quot; title=&quot;Cara Membuat List Pada Dokumen HTML&quot;&gt;
  &lt;img src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhR5DyJjLc9env45zA1BdScKlWnc1EyFqZJi22rsEAqz9FbjZ8TjZMWwdsKC8QM8dlO0IO0iyvLDO-M4wpMZu-SC35oRrNkkzL2UbGJ884KUjIsiBpfryYZiljz8_fZJjSDRJ3Cekuw4V0/s1600/List.png&quot; border=&quot;0&quot; alt=&quot;Cara Membuat List Pada Dokumen HTML&quot;&gt;
 &lt;/a&gt;
&lt;/span&gt;
&lt;span style=&quot;padding: 0px;&quot;&gt;
 &lt;a href=&quot;http://amirabella-zone.blogspot.com/2012/11/cara-membuat-paragraf-html.html&quot; target=&quot;_blank&quot; style=&quot;text-decoration:none;outline:none;&quot; title=&quot;Cara Membuat Paragraf Pada Dokumen HTML&quot;&gt;
  &lt;img src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgid8vcPLfNZfFntnWJaX9wtVR_WfITJKuzuTsnWqhWMWY55kukedKlMB6F01dpDnq5Eo9u-WiHgx6ok_0e8FQbTCyMHw-0RHossjVBr9LLThJ84EeXNx0yavCvRVmMrqZctHuo_VfGGqs/s1600/Paragraf.png&quot; border=&quot;0&quot; alt=&quot;Cara Membuat Paragraf Pada Dokumen HTML&quot;&gt;
 &lt;/a&gt;
&lt;/span&gt;
&lt;span style=&quot;padding: 0px;&quot;&gt;
 &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/cara-memasukkan-lagu-pada-dokumen-html.html&quot; target=&quot;_blank&quot; style=&quot;text-decoration:none;outline:none;&quot; title=&quot;Cara Memasukkan Lagu Pada Dokumen HTML&quot;&gt;
  &lt;img src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhx_396vcxmFfYVYoe8wku-q-b06vhB68rHq4oxRSyuk1iCa0m-5vLxA6RcAff3k-qI5DN99k7VgcJKEdWKOYK4pE0vJzqVmkVGN_Hd1OVuu02cmNA7kMFV8qnghx-GxF-kbKA1MpoBZKo/s1600/Lagu.png&quot; border=&quot;0&quot; alt=&quot;Cara Memasukkan Lagu Pada Dokumen HTML&quot;&gt;
 &lt;/a&gt;
&lt;/span&gt;
&lt;span style=&quot;padding: 0px;&quot;&gt;
 &lt;a href=&quot;http://amirabella-zone.blogspot.com/2012/11/cara-membuat-tabel-pada-dokumen-html.html&quot; target=&quot;_blank&quot; style=&quot;text-decoration:none;outline:none;&quot; title=&quot;Cara Membuat Table Pada Dokumen HTML&quot;&gt;
  &lt;img src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0Rugx6GKoi4mQOXAEvPqoSipqYUyIum3tm7vp44IgI1h6i8vumJcBq36CXUms6unqpExKM-f-ATprtUzxnXY2ei2QyWAEcsP9N6sDr0gnNRf9EzAhaSHOF9oqcRaBnfB3XDRetSJ31tc/s1600/Table.png&quot; border=&quot;0&quot; alt=&quot;Cara Membuat Table Pada Dokumen HTML&quot;&gt;
 &lt;/a&gt;
&lt;/span&gt;
&lt;span style=&quot;padding: 0px;&quot;&gt;
 &lt;a href=&quot;http://amirabella-zone.blogspot.com/2012/11/cara-membuat-text-area-pada-dokumen-html.html&quot; target=&quot;_blank&quot; style=&quot;text-decoration:none;outline:none;&quot; title=&quot;Cara Membuat Text Area Pada Dokumen HTML&quot;&gt;
  &lt;img src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgJ1bschBPVPnVJ9u8v9bKNKWHgLCbkrnHwomcpbu65sYrc42TH9Gw9cqmvfjbzqPpY2fqxa5YUCSNEZD6SCH7BH_8NaUDUmcUBiucKHG294VWhpY_4IQt2AAOAPIp2gwr_puNE5gVhqw/s1600/TextArea.png&quot; border=&quot;0&quot; alt=&quot;Cara Membuat Text Area Pada Dokumen HTML&quot;&gt;
 &lt;/a&gt;
&lt;/span&gt;
&lt;span style=&quot;padding: 0px;&quot;&gt;
 &lt;a href=&quot;http://amirabella-zone.blogspot.com/2012/11/cara-membuat-text-berjalan-pada-dokumen.html&quot; target=&quot;_blank&quot; style=&quot;text-decoration:none;outline:none;&quot; title=&quot;Cara Membuat Text Berjalan pada Dokumen HTML&quot;&gt;
  &lt;img src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiI8DhiF3TV7rvICA9zFjDiWuOvi0omOnpKgQFua6DdAYkgcil8YDSRkYPGftP_z7X7ehzISWhq9a0nEFii-WntQf6bsvWZdbyUJ51udHtb99LaZVWwa2Kkq_eJocA-coUPZXNB9ygqho/s1600/TextBerjalan.png&quot; border=&quot;0&quot; alt=&quot;Cara Membuat Text Berjalan pada Dokumen HTML&quot;&gt;
 &lt;/a&gt;
&lt;/span&gt;
&lt;span style=&quot;padding: 0px;&quot;&gt;
 &lt;a href=&quot;http://amirabella-zone.blogspot.com/2012/11/cara-membuat-heading-pada-dokumen-html.html&quot; target=&quot;_blank&quot; style=&quot;text-decoration:none;outline:none;&quot; title=&quot;Cara Membuat Heading Pada Dokumen HTML&quot;&gt;
  &lt;img src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlzVSUSf1vP_RQPizpxiNqn99u42qsL9up4HPHHO32SNBXYNK6BNQZ7Ex4wThrAi1R4IMW1hTCoK5cj-YctWRY5quqXLns5f_SQIlDgl7CabksvirKP5po6fmtd7JKbOz0OCJqqLkhDr0/s1600/Heading.png&quot; border=&quot;0&quot; alt=&quot;Cara Membuat Heading Pada Dokumen HTML&quot;&gt;
 &lt;/a&gt;
&lt;/span&gt;
&lt;/marquee&gt;

&lt;/div&gt;

&lt;p style=&quot;background:#5E5E5E;color:white;text-align:center;font-weight:bold;margin:0 0 0 0;padding:5px;border-top:#EFEFEF solid 1px;&quot;&gt;
   &lt;a href=&quot;http://adf.ly/wZrB2&quot; target=&quot;_blank&quot; style=&quot;color:white;text-decoration:none;outline:none;&quot;&gt;Download Example Here&lt;/a&gt;
   &lt;/p&gt;
    
 &lt;/div&gt;
&lt;/ol&gt;

&lt;br /&gt;

&lt;p style=&quot;text-align:justify;margin:15px;border-top:#000 solid 1px;&quot;&gt;&lt;blink&gt;&lt;font style=&quot;color:red;&quot;&gt;&lt;b&gt;Nb.&lt;/b&gt;&lt;/font&gt;&lt;/blink&gt; Silahkan beri &lt;i&gt;feed back&lt;/i&gt; pada kotak komentar di bawah!&lt;/p&gt;
 

&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;</description><link>http://amirabella-zone.blogspot.com/2013/03/cara-membuat-link-gambar-berjalan-pada.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhACgpy9odqqOJdXVrYcNjIzow38Vks0m9mDhn3-0kTrbzB1pYx-6e4X99racM8THNBUD1m03vJo7Gs5qPhwVGkfvc7HZELsbpzF_HBKgLpbzGAQ7l37IxYMDqYpvPcFh01xq2dEreww9g/s72-c/MarqueeImagesLink.png" height="72" width="72"/><thr:total>2</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-4650993787890008998</guid><pubDate>Mon, 25 Feb 2013 18:30:00 +0000</pubDate><atom:updated>2015-01-24T02:05:09.987+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Photo Editing</category><title>Download Adobe Creative Suite CS2 Full Serial</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1q-yGw2X71V5YTqHWK_MI6ZUMmFbR7MzPcfWGn_jVFgBeD3wVpcADzdP8hRANm_IuaSJIqCxf6yYZWkhIakpy-8EL6K2HNsemHcx6SgcV66_bCvl6ar0CkRKsCdTNj1e062yZakwfyfw/s1600/CS2.png&quot; imageanchor=&quot;1&quot; style=&quot;clear:left; float:left;margin-right:1em; margin-bottom:1em&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;150&quot; width=&quot;200&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1q-yGw2X71V5YTqHWK_MI6ZUMmFbR7MzPcfWGn_jVFgBeD3wVpcADzdP8hRANm_IuaSJIqCxf6yYZWkhIakpy-8EL6K2HNsemHcx6SgcV66_bCvl6ar0CkRKsCdTNj1e062yZakwfyfw/s320/CS2.png&quot; alt=&quot;Download KBBI v1.5 (Kamus Besar Bahasa Indonesia)&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Pada posting sebelumnya saya share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-kbbi-v15-kamus-besar-bahasa.html&quot;&gt;&lt;i&gt;&amp;#39;KBBI v1.5 (Kamus Besar Bahasa Indonesia)&amp;#39;&lt;/i&gt;&lt;/a&gt;, sekarang saya lanjutkan dengan share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-adobe-creative-suite-cs2-full.html&quot;&gt;&lt;i&gt;&amp;#39;Adobe Creative Suite CS2 Full Serial&amp;#39;&lt;/i&gt;&lt;/a&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;Adobe Creative Suite CS2&lt;/b&gt; adalah aplikasi &lt;i&gt;design grafis&lt;/i&gt; product Adobe Corporation yang didalamnya berisi &lt;i&gt;Adobe Photoshop, Acrobat Pro 7.0, After Effects, Audition 3.0, Illustrator, InDesign, Adobe Premiere Pro, dll.&lt;/i&gt; Meskipun aplikasi ini terbilang sudah jadul, namun masih banyak yang menggunakannya. Dari situs resminya Adobe menyatakan bahwa telah menonaktifkan &lt;i&gt;activation server&lt;/i&gt; untuk CS2 dan tidak lagi mensupport &lt;i&gt;product&lt;/i&gt; ini, sebagai gantinya Adobe menyediakan link download productnya dengan menyertakan serial number secara gratis. Sangat menarik sekali bukan?
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Baiklah silahkan langsung saja download &lt;b&gt;&lt;i&gt;Adobe Creative Suite CS2 Full Serial&lt;/i&gt;&lt;/b&gt; ini di link yang sudah Saya sediakan di bawah.
&lt;/p&gt;

&lt;br /&gt;

&lt;p style=&quot;color:red; text-align:justify;&quot;&gt;&lt;b&gt;&lt;u&gt;Download:&lt;/u&gt;&lt;/b&gt;
&lt;/p&gt;

&lt;ul&gt;
 &lt;li style=&quot;list-style-image:url(&#39;http://i1071.photobucket.com/albums/u502/amirabella270/icon-bullete_zps74e66946.gif&#39;)&quot;&gt;&lt;a href=&quot;http://adf.ly/wZqmg&quot; target=&quot;_blank&quot;&gt;Download Adobe Creative Suite CS2 Full Serial&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;</description><link>http://amirabella-zone.blogspot.com/2013/02/download-adobe-creative-suite-cs2-full.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1q-yGw2X71V5YTqHWK_MI6ZUMmFbR7MzPcfWGn_jVFgBeD3wVpcADzdP8hRANm_IuaSJIqCxf6yYZWkhIakpy-8EL6K2HNsemHcx6SgcV66_bCvl6ar0CkRKsCdTNj1e062yZakwfyfw/s72-c/CS2.png" height="72" width="72"/><thr:total>0</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-2927866973618329471</guid><pubDate>Mon, 25 Feb 2013 17:45:00 +0000</pubDate><atom:updated>2015-01-24T02:02:17.373+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Kamus</category><title>Download KBBI v1.5 (Kamus Besar Bahasa Indonesia)</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSgOv8Bkm3suy6pHV6bYWLPQhg81UJTC8JheI4-r_tQsJ4FN69xPdJn24JliBOMODFgDPq6qknQL5F6zaSsWfxJ3ME3Ae62IDUNpHPlId6h4cJAQMv5c4rxlwDeZdm-6r5gBNrr5FQ2Tg/s1600/KBBI.png&quot; imageanchor=&quot;1&quot; style=&quot;clear:left; float:left;margin-right:1em; margin-bottom:1em&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;150&quot; width=&quot;200&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSgOv8Bkm3suy6pHV6bYWLPQhg81UJTC8JheI4-r_tQsJ4FN69xPdJn24JliBOMODFgDPq6qknQL5F6zaSsWfxJ3ME3Ae62IDUNpHPlId6h4cJAQMv5c4rxlwDeZdm-6r5gBNrr5FQ2Tg/s320/KBBI.png&quot; alt=&quot;Download KBBI v1.5 (Kamus Besar Bahasa Indonesia)&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Pada posting sebelumnya saya share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/cara-memasukkan-lagu-pada-dokumen-html.html&quot;&gt;&lt;i&gt;&amp;#39;Cara Memasukkan Lagu Pada Dokumen HTML&amp;#39;&lt;/i&gt;&lt;/a&gt;, sekarang saya lanjutkan dengan share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-kbbi-v15-kamus-besar-bahasa.html&quot;&gt;&lt;i&gt;&amp;#39;KBBI v1.5 (Kamus Besar Bahasa Indonesia)&amp;#39;&lt;/i&gt;&lt;/a&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;Kamus Besar Bahasa Indonesia&lt;/b&gt; yang dikenal dengan sebutan KBBI terbit pertama 28 Oktober 1988 saat Pembukaan Kongres V Bahasa Indonesia. Sejak itu kamus tersebut telah menjadi sumber rujukan yang dipercaya baik di kalangan pengguna di dalam maupun di luar negeri. Setiap ada permasalahan tentang kata, KBBI selalu dianggap sebagai jalan keluar penyelesaiannya. Selain muatan isi, KBBI memang disusun tidak sekadar sebagai sumber rujukan, tetapi menjadi sumber penggalian ilmu pengetahuan, teknologi, dan seni, serta peradaban Indonesia. Oleh karena itu, rujukan tersebut kemudian semakin mengakar di dalam kehidupan berbahasa Indonesia walaupun upaya penyempurnaan isi tidak selamanya mengimbangi perkembangan kosakata bahasa Indonesia. 
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Baiklah silahkan langsung saja download &lt;b&gt;KBBI v1.5 &lt;i&gt;(Kamus Besar Bahasa Indonesia)&lt;/i&gt;&lt;/b&gt; ini di link yang sudah Saya sediakan di bawah.
&lt;/p&gt;

&lt;br /&gt;

&lt;p style=&quot;color:red; text-align:justify;&quot;&gt;&lt;b&gt;&lt;u&gt;Download:&lt;/u&gt;&lt;/b&gt;
&lt;/p&gt;

&lt;ul&gt;
 &lt;li style=&quot;list-style-image:url(&#39;http://i1071.photobucket.com/albums/u502/amirabella270/icon-bullete_zps74e66946.gif&#39;)&quot;&gt;&lt;a href=&quot;http://adf.ly/wZqWN&quot; target=&quot;_blank&quot;&gt;KBBI v1.5 - Installer&lt;/a&gt;&lt;/li&gt;
 &lt;li style=&quot;list-style-image:url(&#39;http://i1071.photobucket.com/albums/u502/amirabella270/icon-bullete_zps74e66946.gif&#39;)&quot;&gt;&lt;a href=&quot;http://adf.ly/wZqY0&quot; target=&quot;_blank&quot;&gt;KBBI v1.5 - Portable&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;</description><link>http://amirabella-zone.blogspot.com/2013/02/download-kbbi-v15-kamus-besar-bahasa.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSgOv8Bkm3suy6pHV6bYWLPQhg81UJTC8JheI4-r_tQsJ4FN69xPdJn24JliBOMODFgDPq6qknQL5F6zaSsWfxJ3ME3Ae62IDUNpHPlId6h4cJAQMv5c4rxlwDeZdm-6r5gBNrr5FQ2Tg/s72-c/KBBI.png" height="72" width="72"/><thr:total>0</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-4291824872312162043</guid><pubDate>Mon, 25 Feb 2013 00:54:00 +0000</pubDate><atom:updated>2015-01-31T20:39:08.409+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">HTML</category><title>Cara Memasukkan Lagu Pada Dokumen HTML</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMTNnpMle1MWQ5uxiAlptEOM0qdZZUTAvZvXmw0sjnezJ7juRXKFbJbnxe0ET4xr3LsYg9sK7tLS-6BQKDYWoh00WNvaJuNQU9QJVnjGofUJH-sEyBcTgnj5xlfRWyitNOj7AQ8HaeRSA/s1600/lagu.png&quot; imageanchor=&quot;1&quot; style=&quot;clear:left; float:left;margin-right:1em; margin-bottom:1em&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;150&quot; width=&quot;200&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMTNnpMle1MWQ5uxiAlptEOM0qdZZUTAvZvXmw0sjnezJ7juRXKFbJbnxe0ET4xr3LsYg9sK7tLS-6BQKDYWoh00WNvaJuNQU9QJVnjGofUJH-sEyBcTgnj5xlfRWyitNOj7AQ8HaeRSA/s320/lagu.png&quot; alt=&quot;Cara Memasukkan Lagu Pada Dokumen HTML&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Pada posting sebelumnya saya share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-notepad-63.html&quot;&gt;&lt;i&gt;&amp;#39;Notepad++ 6.3&amp;#39;&lt;/i&gt;&lt;/a&gt;, sekarang saya lanjutkan dengan share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/cara-memasukkan-lagu-pada-dokumen-html.html&quot;&gt;&lt;i&gt;&amp;#39;Cara Memasukkan Lagu Pada Dokumen HTML&amp;#39;&lt;/i&gt;&lt;/a&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;Lagu&lt;/b&gt; merupakan gubahan seni nada atau suara dalam urutan, kombinasi, dan hubungan temporal &lt;i&gt;(biasanya diiringi dengan alat musik)&lt;/i&gt; untuk menghasilkan gubahan musik yang mempunyai kesatuan dan kesinambungan &lt;i&gt;(mengandung irama)&lt;/i&gt;. Dan ragam nada atau suara yang berirama disebut juga dengan lagu. Dengan lantunan sebuah lagu hidup ini menjadi semakin berwarna, begitu juga dengan sebuah halaman &lt;i&gt;web&lt;/i&gt; lagu dapat membuatnya menjadi semakin menarik.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Baca juga: &lt;a href=&quot;http://amirabella-zone.blogspot.com/2015/01/cara-memasukkan-playlist-lagu-pada.html&quot; target=&quot;_blank&quot;&gt;Cara Memasukkan Playlist Lagu Pada Dokumen HTML &lt;i&gt;(Memasukkan Lebih Dari Satu Lagu)&lt;/i&gt;&lt;/a&gt;
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Baiklah berikut ini cara memasukkan &lt;b&gt;&lt;i&gt;lagu&lt;/i&gt;&lt;/b&gt; pada sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;.
&lt;/p&gt;

&lt;br /&gt;

&lt;div&gt;
&lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;Langkah-langkah:&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

&lt;p style=&quot;text-align:justify;margin:15px&quot;&gt;&lt;b&gt;&lt;u&gt;Cara Memasukkan Lagu Pada Dokumen HTML:&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;

&lt;ol style=&quot;margin-right:15px;&quot;&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;Jalankan aplikasi &lt;i&gt;text editor&lt;/i&gt; seperti &lt;i&gt;&amp;#39;notepad&amp;#39;&lt;/i&gt; untuk menulis sebuah dokumen &lt;i&gt;HTML&lt;/i&gt;. Mungkin &lt;i&gt;notepad&lt;/i&gt; bawaan &lt;i&gt;windows&lt;/i&gt; kurang begitu menarik, solusinya Anda dapat menggunakan aplikasi &lt;i&gt;notepad++&lt;/i&gt; yang dapat Anda download di &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-notepad-63.html&quot; target=&quot;_blank&quot;&gt;sini&lt;/a&gt;.&lt;/li&gt;
 &lt;br /&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;&lt;b&gt;&lt;i&gt;Penting!&lt;/i&gt;&lt;/b&gt; simpan dokumen &lt;i&gt;HTML&lt;/i&gt; dengan format &lt;b&gt;&lt;i&gt;&amp;#39;Nama_File.html&amp;#39;&lt;/i&gt;&lt;/b&gt; tanpa tanda kutip, kemudian pada &lt;i&gt;&amp;#39;Save as type&amp;#39;&lt;/i&gt; Anda pilih &lt;i&gt;&amp;#39;All files&amp;#39;&lt;/i&gt; agar dokumen yang Anda simpan menjadi dokumen &lt;i&gt;HTML&lt;/i&gt; bukan dokumen &lt;i&gt;text biasa&lt;/i&gt;.&lt;/li&gt; 
 &lt;br /&gt; 
 &lt;li style=&quot;text-align:justify&quot;&gt;Sekarang mari kita mulai untuk memasukkan sebuah &lt;i&gt;lagu&lt;/i&gt; pada dokumen &lt;i&gt;HTML&lt;/i&gt; seperti pada kotak di bawah ini.&lt;/li&gt;
 
 &lt;br /&gt;
 
 &lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;&lt;i&gt;Script Code:&lt;/i&gt;&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

  &lt;font style=&quot;color:#f83ab8;&quot;&gt;&amp;lt;!DOCTYPE html&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;html&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;head&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#59fa38;&quot;&gt;&amp;lt;title&amp;gt;&lt;/font&gt; Cara Memasukkan Lagu Pada Dokumen HTML &lt;font style=&quot;color:#59fa38;&quot;&gt;&amp;lt;/title&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;/head&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;

  &lt;font style=&quot;color:#FF6600;&quot;&gt;&amp;lt;body&amp;gt;&lt;/font&gt;
  
  &lt;p&gt;&amp;lt;! Di bawah ini adalah script untuk memasukkan lagu -&amp;gt; &lt;br /&gt;&lt;font style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;embed src=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;File_Lagu.mp3&lt;/span&gt;&amp;quot; width=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;350px&lt;/span&gt;&amp;quot; height=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;21px&lt;/span&gt;&amp;quot; loop=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;true&lt;/span&gt;&amp;quot;&amp;gt;&lt;/font&gt;&lt;/p&gt;
  
  
  &lt;font style=&quot;color:#FF6600;&quot;&gt;&amp;lt;/body&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;/html&amp;gt;&lt;/font&gt;
  

  &lt;p style=&quot;text-align:justify;margin:40px 0 -5px 0;padding:0px;border-top:#000 solid 1px;&quot;&gt;
    &lt;i&gt;Ganti &lt;span style=&quot;color:red;background:yellow;&quot;&gt;File_Lagu.mp3&lt;/span&gt; dengan lagu Anda, Pada &lt;i&gt;Attribute&lt;/i&gt; &lt;span style=&quot;color:red;background:yellow;&quot;&gt;Width&lt;/span&gt; &amp;amp; &lt;span style=&quot;color:red;background:yellow;&quot;&gt;Height&lt;/span&gt; silahkan sesuaikan value&amp;#39;nya dengan halaman HTML Anda (apabila Anda ingin menyembunyikannya maka ganti value&amp;#39;nya dengan &lt;span style=&quot;color:red;&quot;&gt;0px&lt;/span&gt;), Kemudian untuk attribute &lt;span style=&quot;color:red;background:yellow;&quot;&gt;loop&lt;/span&gt; fungsinya yaitu agar lagu terus berputar tanpa henti namun apabila Anda menginginkan lagu hanya diputar sekali saja maka ganti value&amp;#39;nya menjadi &lt;span style=&quot;color:red;&quot;&gt;false&lt;/span&gt;.&lt;/i&gt;
  &lt;/p&gt;

&lt;/div&gt;
&lt;/div&gt;
 
 &lt;br /&gt;
 &lt;br /&gt;

&lt;div&gt;
 &lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;&lt;i&gt;Update Script Code HTML5:&lt;/i&gt;&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 15px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

  &lt;font style=&quot;color:#f83ab8;&quot;&gt;&amp;lt;!DOCTYPE html&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;html&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;head&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#59fa38;&quot;&gt;&amp;lt;title&amp;gt;&lt;/font&gt; Cara Memasukkan Lagu Pada Dokumen HTML &lt;font style=&quot;color:#59fa38;&quot;&gt;&amp;lt;/title&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#CC33FF;&quot;&gt;&amp;lt;/head&amp;gt;&lt;/font&gt;&lt;br /&gt;&lt;br /&gt;

  &lt;font style=&quot;color:#FF6600;&quot;&gt;&amp;lt;body&amp;gt;&lt;/font&gt;
  
  &lt;p&gt;&amp;lt;! Di bawah ini adalah script untuk memasukkan lagu -&amp;gt; 
&lt;br /&gt;&lt;font style=&quot;color:#3abcf8;&quot;&gt;
&amp;lt;audio controls&amp;gt; 
&lt;br /&gt;
&amp;lt;source src=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;File_Lagu.ogg&lt;/span&gt;&amp;quot; type=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;audio/ogg&lt;/span&gt;&amp;quot;&amp;gt;
&lt;br /&gt;
&amp;lt;source src=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;File_Lagu.mp3&lt;/span&gt;&amp;quot; type=&amp;quot;&lt;span style=&quot;color:red;background:yellow;&quot;&gt;audio/mpeg&lt;/span&gt;&amp;quot;&amp;gt;
&lt;br /&gt;
&amp;lt;audio&amp;gt;&lt;/font&gt;
&lt;/p&gt;
  
  
  &lt;font style=&quot;color:#FF6600;&quot;&gt;&amp;lt;/body&amp;gt;&lt;/font&gt;&lt;br /&gt;
  &lt;font style=&quot;color:#3abcf8;&quot;&gt;&amp;lt;/html&amp;gt;&lt;/font&gt;
  

  &lt;p style=&quot;text-align:justify;margin:40px 0 -5px 0;padding:0px;border-top:#000 solid 1px;&quot;&gt;
    &lt;i&gt;Ganti &lt;span style=&quot;color:red;background:yellow;&quot;&gt;File_Lagu.mp3&lt;/span&gt; dengan lagu Anda!, Sebagai catatan beberapa versi browser lama support file &amp;#39;.ogg&amp;#39; namun tidak support file &amp;#39;.mp3&amp;#39;, sehingga contoh di atas Saya sertakan &amp;#39;source&amp;#39; keduanya, namun Anda dapat memilih salah satu saja. Sebaiknya Anda menggunakan browser terbaru agar sound dapat diputar dengan semestinya.&lt;/i&gt;
  &lt;/p&gt;

&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;


&lt;br /&gt;

 &lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px 15px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px 15px;&quot;&gt;
  
  &lt;p style=&quot;text-align:center;&quot;&gt;
&lt;audio controls&gt;
    &lt;source src=&quot;http://www.w3schools.com/html/horse.ogg&quot; type=&quot;audio/ogg&quot;&gt;
    &lt;source src=&quot;http://www.w3schools.com/html/horse.mp3&quot; type=&quot;audio/mpeg&quot;&gt;
    Your browser does not support the audio element.
&lt;/audio&gt;
  &lt;/p&gt;
    
 &lt;/div&gt;
&lt;/ol&gt;

&lt;br /&gt;

&lt;p style=&quot;text-align:justify;margin:15px;border-top:#000 solid 1px;&quot;&gt;&lt;blink&gt;&lt;font style=&quot;color:red;&quot;&gt;&lt;b&gt;Nb.&lt;/b&gt;&lt;/font&gt;&lt;/blink&gt; Silahkan beri &lt;i&gt;feed back&lt;/i&gt; pada kotak komentar di bawah!&lt;/p&gt;
 

&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt; </description><link>http://amirabella-zone.blogspot.com/2013/02/cara-memasukkan-lagu-pada-dokumen-html.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMTNnpMle1MWQ5uxiAlptEOM0qdZZUTAvZvXmw0sjnezJ7juRXKFbJbnxe0ET4xr3LsYg9sK7tLS-6BQKDYWoh00WNvaJuNQU9QJVnjGofUJH-sEyBcTgnj5xlfRWyitNOj7AQ8HaeRSA/s72-c/lagu.png" height="72" width="72"/><thr:total>1</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-6573801399663063693</guid><pubDate>Wed, 20 Feb 2013 17:52:00 +0000</pubDate><atom:updated>2015-01-24T01:54:27.466+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Text Editor</category><title>Download Notepad++ 6.3</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMsj9KGCda1DTg2RLho0veJ-zpYRVmjIstscNysekwvv2WUotpkbK62K04dc5lvgOT4fkDiUTMcWSsKkhqxrOitYALHe-DudQiy84h808EGojSX632Y7ygZ3y7wKY2doMpKNrVAZRaSkg/s1600/Notepad++.png&quot; imageanchor=&quot;1&quot; style=&quot;clear:left; float:left;margin-right:1em; margin-bottom:1em&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;150&quot; width=&quot;200&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMsj9KGCda1DTg2RLho0veJ-zpYRVmjIstscNysekwvv2WUotpkbK62K04dc5lvgOT4fkDiUTMcWSsKkhqxrOitYALHe-DudQiy84h808EGojSX632Y7ygZ3y7wKY2doMpKNrVAZRaSkg/s320/Notepad++.png&quot; alt=&quot;Download Notepad++ 6.3&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Pada posting sebelumnya saya share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-adobe-flash-player-116602168.html&quot; target=&quot;_blank&quot;&gt;Adobe Flash Player 11.6.602.168 Offline Installer&lt;/a&gt;, kali ini saya akan share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-notepad-63.html&quot; target=&quot;_blank&quot;&gt;Notepad++ 6.3&lt;/a&gt;, yang merupakan aplikasi freeware pengganti Notepad bawaan operating system windows.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;Notepad++ 6.3&lt;/b&gt; adalah sebuah aplikasi text editor yang berlisensi Freeware. Notepad++ ditulis dalam C++ dan menggunakan Win32 API murni dan STL yang menjamin kecepatan eksekusi lebih tinggi dengan ukuran program yang lebih kecil serta mendukung beberapa bahasa pemrograman. Notepad++ 6.3 ini cocok dipakai untuk membuat/mengedit file berformat php, cpp, html, dan sebagainya. Jika dibandingkan dengan Notepad bawaan operating system windows, maka Notepad++ 6.3 ini lebih menarik design dan featurnya.
&lt;/p&gt;

&lt;div&gt;
&lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;Screenshot:&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

&lt;p style=&quot;text-align:center&quot;&gt;
&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAgjSIf9-BsYad5oEVamneq5q_P1sWt4EF62wPRVZB92cBcBXV9TlU1YfHSiodltP_4Bg45FgSdRyb9VK-ChNshO1shyQB6sumKlzKrUE4QD4Hw580ZAHVLC0Qtl-azRrMPdH-2gZCDX8/s1600/SS_Notepad++6.3.jpg&quot; imageanchor=&quot;1&quot; style=&quot;margin-left:1em; margin-right:1em&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;258&quot; width=&quot;320&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAgjSIf9-BsYad5oEVamneq5q_P1sWt4EF62wPRVZB92cBcBXV9TlU1YfHSiodltP_4Bg45FgSdRyb9VK-ChNshO1shyQB6sumKlzKrUE4QD4Hw580ZAHVLC0Qtl-azRrMPdH-2gZCDX8/s320/SS_Notepad++6.3.jpg&quot; alt=&quot;Download Notepad++ 6.3&quot; /&gt;&lt;/a&gt;&lt;/div&gt;
&lt;/p&gt;
&lt;p style=&quot;text-align:justify&quot;&gt;
&lt;b&gt;&lt;u&gt;Features:&lt;/u&gt;&lt;/b&gt;
&lt;ul&gt;
 &lt;li&gt;Syntax Highlighting and Syntax Folding&lt;/li&gt;
 &lt;li&gt;User Defined Syntax Highlighting and Folding&lt;/li&gt;
 &lt;li&gt;PCRE (Perl Compatible Regular Expression) Search/Replace&lt;/li&gt;
 &lt;li&gt;GUI entirely customizable: minimalist, tab with close button, multi-line tab, vertical tab and vertical document list&lt;/li&gt;
 &lt;li&gt;Document Map&lt;/li&gt;
 &lt;li&gt;Auto-completion: Word completion, Function completion and  Function parameters hint&lt;/li&gt;
 &lt;li&gt;Multi-Document (Tab interface)&lt;/li&gt;
 &lt;li&gt;Multi-View&lt;/li&gt;
 &lt;li&gt;WYSIWYG (Printing)&lt;/li&gt;
 &lt;li&gt;Zoom in and zoom out&lt;/li&gt;
 &lt;li&gt;Multi-Language environment supported&lt;/li&gt;
 &lt;li&gt;Bookmark&lt;/li&gt;
 &lt;li&gt;Macro recording and playback&lt;/li&gt;
 &lt;li&gt;Launch with different arguments&lt;/li&gt;
&lt;/ul&gt;
&lt;/p&gt;

&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt; 

&lt;br /&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Baiklah silahkan langsung saja download dan install &lt;b&gt;Notepad++ 6.3&lt;/b&gt; ini di link yang sudah Saya sediakan di bawah.
&lt;/p&gt;

&lt;br /&gt;
&lt;p style=&quot;color:red; text-align:justify;&quot;&gt;&lt;b&gt;&lt;u&gt;Download:&lt;/u&gt;&lt;/b&gt;
&lt;/p&gt;

&lt;ul&gt;
 &lt;li&gt;&lt;a href=&quot;http://adf.ly/wZpjw&quot; target=&quot;_blank&quot;&gt;Download Notepad++ 6.3&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;</description><link>http://amirabella-zone.blogspot.com/2013/02/download-notepad-63.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMsj9KGCda1DTg2RLho0veJ-zpYRVmjIstscNysekwvv2WUotpkbK62K04dc5lvgOT4fkDiUTMcWSsKkhqxrOitYALHe-DudQiy84h808EGojSX632Y7ygZ3y7wKY2doMpKNrVAZRaSkg/s72-c/Notepad++.png" height="72" width="72"/><thr:total>0</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-3490633051788567181</guid><pubDate>Tue, 19 Feb 2013 22:38:00 +0000</pubDate><atom:updated>2013-06-26T15:48:42.232+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Tools</category><title>Download Adobe Flash Player 11.6.602.168 Offline Installer</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieacOwBZGywd1bsgUFc1D4UD6dOOZHYEmTlF4ixYIqDWlJ9gBNqPYhKGFfosA9aTro9NkXgWBT4Rk1UUod3zyRM1BEulnQiPJWptUpKQ7X_CIgBpt-GWqZg-7RUnY6HrTMzXmnnNi5d44/s1600/AdobeFlashPlayer.png&quot; imageanchor=&quot;1&quot; style=&quot;clear:left; float:left;margin-right:1em; margin-bottom:1em&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;150&quot; width=&quot;200&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieacOwBZGywd1bsgUFc1D4UD6dOOZHYEmTlF4ixYIqDWlJ9gBNqPYhKGFfosA9aTro9NkXgWBT4Rk1UUod3zyRM1BEulnQiPJWptUpKQ7X_CIgBpt-GWqZg-7RUnY6HrTMzXmnnNi5d44/s320/AdobeFlashPlayer.png&quot; alt=&quot;Download Adobe Flash Player 11.6.602.168 Offline Installer&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Pada Posting sebelumnya saya share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/cara-menampilkan-tumbnails-psd-pada.html&quot; style=&quot;text-decoration:none;&quot;&gt;&lt;i&gt;&amp;#39;Cara Menampilkan Tumbnails PSD pada Windows Explorer x64&amp;#47;x86&amp;#39;&lt;/i&gt;&lt;/a&gt;, sekarang saya lanjutkan dengan share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-adobe-flash-player-116602168.html&quot; style=&quot;text-decoration:none;&quot;&gt;&lt;i&gt;&amp;#39;Adobe Flash Player 11.6.602.168 Offline Installer&amp;#39;&lt;/i&gt;&lt;/a&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;Adobe Flash Player&lt;/b&gt; merupakan aplikasi atau &lt;i&gt;software&lt;/i&gt; yang dapat di katakan wajib di &lt;i&gt;install&lt;/i&gt; pada sebuah perangkat komputer khususnya bagi mereka yang menggunakan komputer untuk keperluan &lt;i&gt;browsing&lt;/i&gt; internet, karena beberapa website tertentu memerlukan &lt;i&gt;Adobe Flash Player&lt;/i&gt; agar halaman websitenya dapat di tampilkan sebagaimana mestinya seperti &lt;i&gt;&lt;a href=&quot;http://www.amirabella-zone.blogspot.com&quot; style=&quot;text-decoration:none;&quot;&gt;Amirabella-Zone&lt;/a&gt;, Facebook, &lt;a href=&quot;http://www.uthk-mandiri.com&quot; style=&quot;text-decoration:none;&quot;&gt;UTHK-Mandiri&lt;/a&gt;&lt;/i&gt;, Youtube, dan website lainya yang di dalamnya terdapat &lt;i&gt;content streaming audio, video, dan live chat&lt;/i&gt; yang memerlukan &lt;i&gt;Adobe Flash Player&lt;/i&gt; agar &lt;i&gt;content&lt;/i&gt; tersebut dapat di &lt;i&gt;load&lt;/i&gt; atau di tampilkan sebagaimana seharusnya.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Baiklah silahkan langsung saja download &lt;b&gt;&lt;i&gt;&amp;#39;Adobe Flash Player 11.6.602.168 Offline Installer&amp;#39;&lt;/i&gt;&lt;/b&gt; ini, di link yang sudah saya sediakan di bawah.
&lt;/p&gt;

&lt;br /&gt;
&lt;p style=&quot;color:red; text-align:justify;&quot;&gt;&lt;b&gt;&lt;u&gt;Download:&lt;/u&gt;&lt;/b&gt;
&lt;/p&gt;

&lt;ul&gt;
 &lt;li style=&quot;list-style-image:url(&#39;http://i1071.photobucket.com/albums/u502/amirabella270/icon-bullete_zps74e66946.gif&#39;)&quot;&gt;&lt;a href=&quot;http://www.mediafire.com/?5sl05lehac9501b&quot; target=&quot;_blank&quot;&gt;Download Adobe Flash Player ActiveX 11.6.602.168&lt;/a&gt; &lt;i&gt;(Untuk Internet Explorer)&lt;/i&gt;&lt;/li&gt;
 &lt;li style=&quot;list-style-image:url(&#39;http://i1071.photobucket.com/albums/u502/amirabella270/icon-bullete_zps74e66946.gif&#39;)&quot;&gt;&lt;a href=&quot;http://www.mediafire.com/?18zdweat1doil1e&quot; target=&quot;_blank&quot;&gt;Download Adobe Flash Player Plugin 11.6.602.168&lt;/a&gt; &lt;i&gt;(Untuk Browser Selain Internet Explorer)&lt;/i&gt;&lt;/li&gt;
&lt;/ul&gt;</description><link>http://amirabella-zone.blogspot.com/2013/02/download-adobe-flash-player-116602168.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieacOwBZGywd1bsgUFc1D4UD6dOOZHYEmTlF4ixYIqDWlJ9gBNqPYhKGFfosA9aTro9NkXgWBT4Rk1UUod3zyRM1BEulnQiPJWptUpKQ7X_CIgBpt-GWqZg-7RUnY6HrTMzXmnnNi5d44/s72-c/AdobeFlashPlayer.png" height="72" width="72"/><thr:total>0</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-8687867676772012200</guid><pubDate>Fri, 15 Feb 2013 18:47:00 +0000</pubDate><atom:updated>2013-02-17T03:50:33.468+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Photo Editing</category><title>Cara Menampilkan Tumbnails PSD pada Windows Explorer x64/x86</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOJ0fOnj1Z6xpnUwCp5PIT_jT608JdTrg1-Az6-2UxgIUTsn3Z5VFTOrsfSoYXhsbZhl694rt3QEecB2KwVpt0BEuG3i5AQ5i9jvzN40HZygSmEYGb2m8E0rsTauNfAqW7lrqVf6DLpIM/s1600/PSD.png&quot; imageanchor=&quot;1&quot; style=&quot;clear:left; float:left;margin-right:1em; margin-bottom:1em&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;150&quot; width=&quot;200&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOJ0fOnj1Z6xpnUwCp5PIT_jT608JdTrg1-Az6-2UxgIUTsn3Z5VFTOrsfSoYXhsbZhl694rt3QEecB2KwVpt0BEuG3i5AQ5i9jvzN40HZygSmEYGb2m8E0rsTauNfAqW7lrqVf6DLpIM/s320/PSD.png&quot; alt=&quot;Cara Menampilkan Tumbnails PSD pada Windows Explorer x64/x86&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Pada Posting sebelumnya saya share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-google-chrome-240131260.html&quot; style=&quot;text-decoration:none;&quot;&gt;&lt;i&gt;&amp;#39;Google Chrome 24.0.1312.60 Standalone&amp;#39;&lt;/i&gt;&lt;/a&gt;, sekarang saya lanjutkan dengan share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/cara-menampilkan-tumbnails-psd-pada.html&quot; style=&quot;text-decoration:none;&quot;&gt;&lt;i&gt;&amp;#39;Cara Menampilkan Tumbnails PSD pada Windows Explorer x64/x86&amp;#39;&lt;/i&gt;&lt;/a&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;Tumbnails&lt;/b&gt; adalah sebuah file gambar yang telah dikurangi ukurannya yang berfungsi menunjukkan &lt;i&gt;preview&lt;/i&gt; dari sebuah file sehingga aktifitas menentukan dan mengorganisasikan file-file gambar dapat dilakukan dengan mudah. Pada &lt;i&gt;Windows Explorer&lt;/i&gt; kita dapat dengan mudah menentukan sebuah file gambar berekstensi JPG, PNG, BMP, dsb dengan melihat &lt;i&gt;tumbnails (preview)&lt;/i&gt; file tersebut, namun ketika kita akan menentukan sebuah file PSD &lt;i&gt;(Photoshop Document)&lt;/i&gt; kita mengalami kesulitan karena kita tidak dapat melihat &lt;i&gt;tumbnails&lt;/i&gt; file tersebut, untuk itu kita membutuhkan sebuah &lt;i&gt;software&lt;/i&gt; atau dapat disebut &lt;i&gt;codec&lt;/i&gt; agar &lt;i&gt;Windows Explorer&lt;/i&gt; dapat menampilkan &lt;i&gt;tumbnails&lt;/i&gt; file PSD. Tools ini dapat berjalan dengan baik pada Windows 7 32bit maupun 64bit. Tools tersebut adalah &lt;b&gt;&lt;i&gt;Pictus Image Viewer&lt;/i&gt;&lt;/b&gt; sebuah aplikasi &lt;i&gt;image viewer&lt;/i&gt; yang dapat membuat &lt;i&gt;Windows Explorer&lt;/i&gt; dapat menampilkan &lt;i&gt;tumbnails&lt;/i&gt; file BMP, GIF, JPG, PCX, PNG, PSD &lt;i&gt;(Adobe Photoshop)&lt;/i&gt;, PSP &lt;i&gt;(CorelPaint Shop Pro)&lt;/i&gt;, TGA, TIFF, WBMP and XYZ.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Baiklah silahkan langsung saja download dan install &lt;b&gt;&lt;i&gt;&amp;#39;Pictus Image Viewer&amp;#39;&lt;/i&gt;&lt;/b&gt; ini, di link yang sudah saya sediakan di bawah. 
&lt;/p&gt;

&lt;br /&gt;
&lt;p style=&quot;color:red; text-align:justify;&quot;&gt;&lt;b&gt;&lt;u&gt;Download:&lt;/u&gt;&lt;/b&gt;
&lt;/p&gt;

&lt;ul&gt;
 &lt;li style=&quot;list-style-image:url(&#39;http://i1071.photobucket.com/albums/u502/amirabella270/icon-bullete_zps74e66946.gif&#39;)&quot;&gt;&lt;a href=&quot;http://www.mediafire.com/?pti776tdtcdc91s&quot; target=&quot;_blank&quot;&gt;Download Pictus Image Viewer&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;</description><link>http://amirabella-zone.blogspot.com/2013/02/cara-menampilkan-tumbnails-psd-pada.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOJ0fOnj1Z6xpnUwCp5PIT_jT608JdTrg1-Az6-2UxgIUTsn3Z5VFTOrsfSoYXhsbZhl694rt3QEecB2KwVpt0BEuG3i5AQ5i9jvzN40HZygSmEYGb2m8E0rsTauNfAqW7lrqVf6DLpIM/s72-c/PSD.png" height="72" width="72"/><thr:total>0</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-6013894067448654974</guid><pubDate>Tue, 12 Feb 2013 19:53:00 +0000</pubDate><atom:updated>2013-02-13T03:58:12.657+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Browser</category><title>Download Google Chrome 24.0.1312.60 Standalone</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlOmlBRnsbzZqtGMBDCSRdfC0MdFihj5wGgqoz5LwL62ivkyCRmFiw0u3-lumDE08PfRzrmM3EJZVBXgiye202W5hl0W2B2FOfnpCv6-SxO1Ryjf-3RttwzqrRtrv2CTLGA92Ziq6ExWE/s1600/GoogleChrome.png&quot; imageanchor=&quot;1&quot; style=&quot;clear:left; float:left;margin-right:1em; margin-bottom:1em&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;150&quot; width=&quot;200&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlOmlBRnsbzZqtGMBDCSRdfC0MdFihj5wGgqoz5LwL62ivkyCRmFiw0u3-lumDE08PfRzrmM3EJZVBXgiye202W5hl0W2B2FOfnpCv6-SxO1Ryjf-3RttwzqrRtrv2CTLGA92Ziq6ExWE/s320/GoogleChrome.png&quot; alt=&quot;Download Google Chrome 24.0.1312.60 Standalone&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Pada Posting sebelumnya saya share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/01/cara-membuat-shortcut-keyboard-sebuah.html&quot; style=&quot;text-decoration:none;&quot;&gt;&lt;i&gt;&amp;#39;Cara Membuat Shortcut Keyboard Sebuah Program&amp;#39;&lt;/i&gt;&lt;/a&gt;, sekarang saya lanjutkan dengan share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/02/download-google-chrome-240131260.html&quot; style=&quot;text-decoration:none;&quot;&gt;&lt;i&gt;&amp;#39;Google Chrome 24.0.1312.60 Standalone&amp;#39;&lt;/i&gt;&lt;/a&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;Google Chrome&lt;/b&gt; adalah sebuah aplikasi browser internet/web &lt;i&gt;open source&lt;/i&gt; yang dikembangkan oleh Google dengan menggunakan mesin rendering &lt;i&gt;WebKit&lt;/i&gt;. Proyek &lt;i&gt;open source&amp;#39;nya&lt;/i&gt; sendiri dinamakan &lt;i&gt;Chromium&lt;/i&gt;. &lt;b&gt;Google Chrome Standalone&lt;/b&gt; ini berupa &lt;i&gt;installer&lt;/i&gt; yang dapat Anda download untuk kemudian di &lt;i&gt;install&lt;/i&gt; pada komputer secara &lt;i&gt;offline&lt;/i&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Baiklah silahkan langsung saja download &lt;i&gt;&amp;#39;Google Chrome 24.0.1312.60 Standalone&amp;#39;&lt;/i&gt; ini, di link yang sudah saya sediakan di bawah. 
&lt;/p&gt;

&lt;br /&gt;
&lt;p style=&quot;color:red; text-align:justify;&quot;&gt;&lt;b&gt;&lt;u&gt;Download:&lt;/u&gt;&lt;/b&gt;
&lt;/p&gt;

&lt;ul&gt;
 &lt;li style=&quot;list-style-image:url(&#39;http://i1071.photobucket.com/albums/u502/amirabella270/icon-bullete_zps74e66946.gif&#39;)&quot;&gt;&lt;a href=&quot;http://www.mediafire.com/?7ope444o7xati7n&quot; target=&quot;_blank&quot;&gt;Download Google Chrome 24.0.1312.60 Standalone&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;</description><link>http://amirabella-zone.blogspot.com/2013/02/download-google-chrome-240131260.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlOmlBRnsbzZqtGMBDCSRdfC0MdFihj5wGgqoz5LwL62ivkyCRmFiw0u3-lumDE08PfRzrmM3EJZVBXgiye202W5hl0W2B2FOfnpCv6-SxO1Ryjf-3RttwzqrRtrv2CTLGA92Ziq6ExWE/s72-c/GoogleChrome.png" height="72" width="72"/><thr:total>0</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-7901721628670746297</guid><pubDate>Wed, 16 Jan 2013 18:42:00 +0000</pubDate><atom:updated>2013-01-17T02:53:03.361+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Computer</category><title>Cara Membuat Shortcut Keyboard Sebuah Program</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2eYsQg1DRa14ADGSlr8UHsSft9pIynk4MNs51dVqoy3LdsLXRMBBAQhthXz0hapBw57O7Qlx8lrojkmack0cg6MtMVIEu3b1pSHOjXqZ20DSkM1KGlh1_zT7my4W-LJjwA0cG_GMbDiQ/s1600/Keyboard.png&quot; imageanchor=&quot;1&quot; style=&quot;clear:left; float:left;margin-right:1em; margin-bottom:1em&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;150&quot; width=&quot;200&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2eYsQg1DRa14ADGSlr8UHsSft9pIynk4MNs51dVqoy3LdsLXRMBBAQhthXz0hapBw57O7Qlx8lrojkmack0cg6MtMVIEu3b1pSHOjXqZ20DSkM1KGlh1_zT7my4W-LJjwA0cG_GMbDiQ/s320/Keyboard.png&quot; alt=&quot;Cara Membuat Shortcut Keyboard Sebuah Program&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Pada Posting sebelumnya saya share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/01/kumpulan-shortcut-keyboard-dari-z.html&quot; style=&quot;text-decoration:none;&quot;&gt;&lt;i&gt;&amp;#39;Kumpulan Shortcut Keyboard dari A-Z (Lengkap)&amp;#39;&lt;/i&gt;&lt;/a&gt;, sekarang saya lanjutkan dengan share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/01/cara-membuat-shortcut-keyboard-sebuah.html&quot; style=&quot;text-decoration:none;&quot;&gt;&lt;i&gt;&amp;#39;Cara Membuat Shortcut Keyboard Sebuah Program&amp;#39;&lt;/i&gt;&lt;/a&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;Shortcut Keyboard&lt;/b&gt; adalah sebuah shortcut/jalan pintas yang berupa kombinasi dari beberapa tombol atau hanya terdiri dari sebuah tombol yang fungsinya untuk menjalankan perintah pada sebuah perangkat komputer. Pada &lt;i&gt;operating system windows&lt;/i&gt; terdapat &lt;i&gt;shortcut keyboard standard&lt;/i&gt; seperti yang dapat Anda lihat di posting Saya sebelumnya, namun Anda jg di perkenankan membuat &lt;i&gt;shortcut keyboard&lt;/i&gt; sendiri untuk menjalankan sebuah program. Baiklah berikut ini langkah-langkah untuk membuat &lt;i&gt;shortcut keyboard&lt;/i&gt;.
&lt;/p&gt;

&lt;br /&gt;

&lt;div&gt;
&lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;Screenshot &amp;amp; Langkah-langkah:&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

&lt;p style=&quot;text-align:justify;margin:15px;&quot;&gt;&lt;b&gt;&lt;u&gt;Cara Membuat Shortcut Keyboard Sebuah Program:&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;

&lt;ol style=&quot;margin-right:15px;&quot;&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;Klik kanan program yang akan di buatkan &lt;i&gt;shortcut keyboard&lt;/i&gt; sebagai contoh di sini &lt;i&gt;Mozilla Firefox&lt;/i&gt; kemudian klik &lt;b&gt;&lt;i&gt;&amp;#39;Properties&amp;#39;&lt;/i&gt;&lt;/b&gt;. Seperti pada gambar berikut ini.&lt;/li&gt;
 
&lt;p&gt;
 &lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuIiVQQvpTOhDOfmqViC3chFNQVg45tkIJi3URsjinZ9UUYrlHp7QI9bqiPxyCWwxmoNMyu8ycJHu4vPuNzeP_NKFmzXs_8XI0fwLbZYvm1fksZliz_xvhEMCHPVC2keimCUy8PnoAdHs/s1600/SS_ShortcutKeyboard1.jpg&quot; imageanchor=&quot;1&quot; style=&quot;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;400&quot; width=&quot;400&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuIiVQQvpTOhDOfmqViC3chFNQVg45tkIJi3URsjinZ9UUYrlHp7QI9bqiPxyCWwxmoNMyu8ycJHu4vPuNzeP_NKFmzXs_8XI0fwLbZYvm1fksZliz_xvhEMCHPVC2keimCUy8PnoAdHs/s400/SS_ShortcutKeyboard1.jpg&quot; alt=&quot;Cara Membuat Shortcut Keyboard Sebuah Program&quot; /&gt;&lt;/a&gt;

&lt;/p&gt;
     
 &lt;li style=&quot;text-align:justify&quot;&gt;Lalu akan muncul kotak dialog &lt;b&gt;&lt;i&gt;&amp;#39;Mozilla Firefox Properties&amp;#39;&lt;/i&gt;&lt;/b&gt;, pada tab &lt;b&gt;&lt;i&gt;&amp;#39;Shortcut&amp;#39;&lt;/i&gt;&lt;/b&gt; kemudian letakkan &lt;i&gt;mouse pointer&lt;/i&gt; di dalam kotak &lt;b&gt;&lt;i&gt;&amp;#39;Shortcut Key&amp;#39;&lt;/i&gt;&lt;/b&gt; lalu tekan kombinasi tombol &lt;u&gt;&lt;i&gt;&amp;#39;Ctrl+Alt+Salah satu huruf yang Anda pilih&amp;#39;&lt;/i&gt;&lt;/u&gt; sebagai contoh di sini huruf &lt;b&gt;&amp;#39;F&amp;#39;&lt;/b&gt; maka kombinasi tombolnya menjadi &lt;b&gt;&lt;i&gt;&amp;#39;Ctrl+Alt+F&amp;#39;&lt;/i&gt;&lt;/b&gt;. Seperti pada gambar di bawah ini. &lt;/li&gt; 

&lt;p&gt;
 &lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMpXYIhTuNHvLZkhOE30_ruwg6HTeBYjDUY0yuUQJP28G-Sn7CTm2zdZlv9Xy6KX1vM7zMqe53ZKp7SqJrDvu5T5LTRFMQ8s3xUgMaQDQ1BtioelD_6KIM1khpMjW2UhQAGv2AaesVeio/s1600/SS_ShortcutKeyboard2.jpg&quot; imageanchor=&quot;1&quot; style=&quot;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;400&quot; width=&quot;282&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMpXYIhTuNHvLZkhOE30_ruwg6HTeBYjDUY0yuUQJP28G-Sn7CTm2zdZlv9Xy6KX1vM7zMqe53ZKp7SqJrDvu5T5LTRFMQ8s3xUgMaQDQ1BtioelD_6KIM1khpMjW2UhQAGv2AaesVeio/s400/SS_ShortcutKeyboard2.jpg&quot; alt=&quot;Cara Membuat Shortcut Keyboard Sebuah Program&quot; /&gt;&lt;/a&gt;

&lt;/p&gt;

 &lt;li style=&quot;text-align:justify&quot;&gt;&lt;b&gt;&lt;i&gt;Selesai..!!&lt;/i&gt;&lt;/b&gt; Anda telah berhasil membuat &lt;i&gt;Shortcut Keyboard untuk sebuah program&lt;/i&gt;. Sekarang ketika Anda tekan kombinasi tombol &lt;b&gt;&lt;i&gt;&amp;#39;Ctrl+Alt+F&amp;#39;&lt;/i&gt;&lt;/b&gt; maka aplikasi &lt;i&gt;Mozilla Firefox&lt;/i&gt; akan di eksekusi.&lt;/li&gt;
&lt;/ol&gt;

&lt;br /&gt;

&lt;p style=&quot;text-align:justify;margin:15px;border-top:#000 solid 1px;&quot;&gt;&lt;blink&gt;&lt;font style=&quot;color:red;&quot;&gt;&lt;b&gt;Nb.&lt;/b&gt;&lt;/font&gt;&lt;/blink&gt; &lt;i&gt;Anda dapat membuat kombinasi tombol Shortcut Keyboard sesuai selera&lt;/i&gt;.&lt;/p&gt;


&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;</description><link>http://amirabella-zone.blogspot.com/2013/01/cara-membuat-shortcut-keyboard-sebuah.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2eYsQg1DRa14ADGSlr8UHsSft9pIynk4MNs51dVqoy3LdsLXRMBBAQhthXz0hapBw57O7Qlx8lrojkmack0cg6MtMVIEu3b1pSHOjXqZ20DSkM1KGlh1_zT7my4W-LJjwA0cG_GMbDiQ/s72-c/Keyboard.png" height="72" width="72"/><thr:total>0</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-8943484448322849294</guid><pubDate>Tue, 15 Jan 2013 22:33:00 +0000</pubDate><atom:updated>2015-01-25T10:22:55.611+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Computer</category><title>Kumpulan Shortcut Keyboard dari A-Z (Lengkap)</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7WHdVjPezgFiRxarJMqLUFE5Z3Z6YNO6P9CSEVheJZj-OOeRvHPHQK0nm8p5_CcZjhpw3UHzou8zmw9pZ5RSrFSO7Z1WHOZySAMKgOhff_My14eUq_vS99VGsQJf6A9DNpDsySssMRJc/s1600/Keyboard.png&quot; imageanchor=&quot;1&quot; style=&quot;clear:left; float:left;margin-right:1em; margin-bottom:1em&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;150&quot; width=&quot;200&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7WHdVjPezgFiRxarJMqLUFE5Z3Z6YNO6P9CSEVheJZj-OOeRvHPHQK0nm8p5_CcZjhpw3UHzou8zmw9pZ5RSrFSO7Z1WHOZySAMKgOhff_My14eUq_vS99VGsQJf6A9DNpDsySssMRJc/s320/Keyboard.png&quot; alt=&quot;Kumpulan Shortcut Keyboard dari A-Z (Lengkap)&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Pada Posting sebelumnya saya share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/01/cara-convert-pdf-to-text-document.html&quot; style=&quot;text-decoration:none;&quot;&gt;&lt;i&gt;&amp;#39;Cara Convert PDF to Text Document&amp;#39;&lt;/i&gt;&lt;/a&gt;, sekarang saya lanjutkan dengan share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/01/kumpulan-shortcut-keyboard-dari-z.html&quot; style=&quot;text-decoration:none;&quot;&gt;&lt;i&gt;&amp;#39;Kumpulan Shortcut Keyboard dari A-Z (Lengkap)&amp;#39;&lt;/i&gt;&lt;/a&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;Shortcut Keyboard&lt;/b&gt; adalah sebuah shortcut/jalan pintas yang berupa kombinasi dari beberapa tombol atau hanya terdiri dari sebuah tombol yang fungsinya untuk menjalankan perintah pada sebuah perangkat komputer. Dengan mengetahui &lt;i&gt;shortcut keyboard&lt;/i&gt; kita akan dapat mengoperasikan komputer jauh lebih cepat dari sebelumnya, sekaligus dapat mengurangi ketergantungan dalam penggunaan &lt;i&gt;mouse&lt;/i&gt;/tetikus. Baiklah berikut ini kumpulan &lt;i&gt;shortcut keyboard&lt;/i&gt; dari A-Z &lt;i&gt;(Lengkap)&lt;/i&gt;.
&lt;/p&gt;

&lt;br /&gt;

&lt;div&gt;
&lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;Shortcut Keyboard:&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

&lt;p style=&quot;text-align:justify;margin:15px;&quot;&gt;&lt;b&gt;&lt;u&gt;Kumpulan Shortcut Keyboard dari A-Z:&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;

&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 15px; padding: 10px 15px 20px;-webkit-border-radius: 5px; border: 1px inset; margin: 15px; padding: 10px 15px 20px;&quot;&gt;

&lt;p style=&quot;text-align:center;margin:0px;font-weight:bold;&quot;&gt;Perintah Umum&lt;/p&gt;
&lt;hr /&gt;

&lt;b&gt;&lt;i&gt;F1&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Membuka jendela bantuan &lt;i&gt;(help)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;F2&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Ubah nama item yang di pilih. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;F3&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Mencari sebuah file atau folder. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;F4&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menampilkan &lt;i&gt;Address bar list&lt;/i&gt; di &lt;i&gt;My Computer&lt;/i&gt; atau &lt;i&gt;Windows Explorer&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;F5&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : &lt;i&gt;Refresh&lt;/i&gt; jendela aktif. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+C&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Salin &lt;i&gt;(Copy)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+X&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Potong &lt;i&gt;(Cut)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+V&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Tempel &lt;i&gt;(Paste)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+Z&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Mengembalikan ke keadaan seperti sebelumnya  &lt;i&gt;(Undo)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+Shift+Z&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Redo &lt;i&gt;(kebalikan dari Undo)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+Shift+N&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Membuat folder baru pada &lt;i&gt;windows explorer&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Del&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Hapus &lt;i&gt;(Delete)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Shift+Del&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menghapus item yang di pilih secara permanen. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl sambil menyeret (drag) sebuah item&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menyalin item yang di pilih. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+Shift sambil menyeret (drag) item&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Membuat shortcut item yang di pilih. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+Right Arrow&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Memindahkan &lt;i&gt;pointer&lt;/i&gt; ke awal kata berikutnya. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+Left Arrow&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Memindahkan &lt;i&gt;pointer&lt;/i&gt; ke awal kata sebelumnya. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+Down Arrow&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Memindahkan &lt;i&gt;pointer&lt;/i&gt; ke awal paragraf berikutnya. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+Up Arrow&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Memindahkan &lt;i&gt;pointer&lt;/i&gt; ke awal paragraf sebelumnya. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+Shift+Arrow Key&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Sorot &lt;i&gt;(blok)&lt;/i&gt; teks. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Shift+Arrow Key&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Pilih lebih dari satu item dalam sebuah jendela atau blok teks. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+A&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Pilih semua. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Alt+Enter&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Melihat properti untuk item yang dipilih. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Alt+F4&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menutup jendela aktif &lt;i&gt;(Close)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Alt+Enter&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menampilkan properti dari objek yang dipilih. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Alt+Spacebar&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Membuka &lt;i&gt;menu bar&lt;/i&gt; untuk jendela aktif. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+F4&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menutup &lt;i&gt;tab&lt;/i&gt; aktif apabila Anda membuka beberapa jendela &lt;i&gt;tab&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Alt+Tab&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Beralih antara item yang terbuka &lt;i&gt;(kotak dialog otomatis close)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+Alt+Tab&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Beralih antara item yang terbuka &lt;i&gt;(kotak dialog tetap terbuka)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Alt+Esc&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Cycle melalui item dalam urutan yang mereka telah dibuka. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Shift+F10&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menampilkan menu shortcut untuk item yang dipilih. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+Esc&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menampilkan menu Start. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Arrow Key&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Navigasi.&lt;br /&gt;
&lt;b&gt;&lt;i&gt;Backspace&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Kembali ke jendela atau karakter sebelumnya. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Esc&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Membatalkan tugas sekarang &lt;i&gt;(Close)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Shift ketika memasukkan CD/DVD&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Mencegah &lt;i&gt;CD-ROM autoplay&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+Shift+Click Sebuah Program&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Membuka program sebagai &lt;i&gt;Administartor&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Shift+Right Click pada windows explorer&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Membuka &lt;i&gt;Command Windows&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Shift+Klik program pada Taskbar&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Membuka program ke dalam &lt;i&gt;New Windows&lt;/i&gt;.

&lt;/div&gt;

&lt;br /&gt;

&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 15px; padding: 10px 15px 20px;-webkit-border-radius: 5px; border: 1px inset; margin: 15px; padding: 10px 15px 20px;&quot;&gt;

&lt;p style=&quot;text-align:center;margin:0px;font-weight:bold;&quot;&gt;Microsoft Natural Keyboard Shortcuts&lt;/p&gt;
&lt;hr /&gt;

&lt;b&gt;&lt;i&gt;Windows Logo&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menampilkan atau menyembunyikan menu Start. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Logo Windows+BREAK&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menampilkan System Properties dialog box. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Logo Windows+D&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menampilkan the desktop. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Logo Windows+M&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Meminimalkan semua jendela. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Logo Windows+SHIFT+M&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Memulihkan jendela yang diminimalkan. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Logo Windows+E&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Membuka My Computer. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Logo Windows+F&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Mencari sebuah file, folder, atau program. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;CTRL+Windows Logo+F&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Mencari komputer dalam satu jaringan. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;CTRL+Windows Logo+TAB&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Beralih antara item yang terbuka dalam bentuk 3D. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Logo Windows+F1&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menampilkan Windows Help. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Logo Windows+L&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Mengunci keyboard. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Logo Windows+P&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menghubungkan Laptop dengan sebuah Projector. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Logo Windows+R&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Membuka kotak dialog Run. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Logo Windows+T&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Tumbnail pada Taskbar. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Logo Windows+U&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Membuka Utility Manager. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Logo Windows+Spacebar&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Secara cepat menunjukkan desktop. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Logo Windows+Arrow Key&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menampilkan jendela aktif ke sisi kiri/kanan/tengah.

&lt;/div&gt;

&lt;br /&gt;

&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 15px; padding: 10px 15px 20px;-webkit-border-radius: 5px; border: 1px inset; margin: 15px; padding: 10px 15px 20px;&quot;&gt;

&lt;p style=&quot;text-align:center;margin:0px;font-weight:bold;&quot;&gt;Character Map Keyboard Shortcuts&lt;/p&gt;
&lt;hr /&gt;

&lt;b&gt;&lt;i&gt;Right Arrow&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Pindah ke kanan satu karakter. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+Right Arrow&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Pindah ke kanan di awal kalimat berikutnya. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Left Arrow&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Pindah ke kiri satu karakter. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+Left Arrow&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Pindah ke kiri di awal kalimat sebelumnya. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Up Arrow&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Pindah ke atas satu baris. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Down Arrow&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Pindah ke bawah satu baris. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Page Up&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Pindah ke atas satu layar pada satu waktu. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Down&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Pindah ke bawah satu layar pada satu waktu. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Home&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Pindah ke awal baris. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;End&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Pindah ke akhir baris. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+Home&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Pindah ke karakter pertama. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+End&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Pindah ke karakter terakhir. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Spacebar&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Memasukkan karakter spasi. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Backspace&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menghapus karakter sebelumnya. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Del&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menghapus karakter sesudahnya.

&lt;/div&gt;

&lt;br /&gt;

&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 15px; padding: 10px 15px 20px;-webkit-border-radius: 5px; border: 1px inset; margin: 15px; padding: 10px 15px 20px;&quot;&gt;

&lt;p style=&quot;text-align:center;margin:0px;font-weight:bold;&quot;&gt;Browser&lt;/p&gt;
&lt;hr /&gt;

&lt;b&gt;&lt;i&gt;Ctrl+(1-9)&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Pindah ke tab yang terbuka sesuai dengan urutan nomor. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+A&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Blok semua data dalam dokumen. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+B&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Organize favorites Internet Explorer, bookmark sidebar Firefox. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+C&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Copy &lt;i&gt;(salin)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+D&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Bookmark halaman. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+E&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Mencari cepat &lt;i&gt;(Quick search)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+F&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Mencari data. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+G&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Mencari &lt;i&gt;(search)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+H&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : History. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+I&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Sidebar favorites Internet Explorer, sidebar bookmark firefox. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+J&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Kotak download. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+K&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Mencari cepat. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+L&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Memasukkan alamat web pada browser. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+M&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Windows Network Diagnostics &lt;i&gt;(Internet Explorer)&lt;/i&gt;, Email &lt;i&gt;(Opera)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+N&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Jendela baru &lt;i&gt;(New window)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+O&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Membuka document &lt;i&gt;(Open)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+P&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Mencetak halaman &lt;i&gt;(Print)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+R&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Reload/Refresh halaman &lt;i&gt;(muat ulang halaman)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+S&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menyimpan document &lt;i&gt;(Save)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+T&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Membuka tab baru pada browser. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+U&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Page Source &lt;i&gt;(melihat script web)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+V&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menempelkan kata yang sudah di copy &lt;i&gt;(Paste)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+W&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Close jendela aktif. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+X&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Memindahkan kata &lt;i&gt;(Cut)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+Y&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Kebalikan dari Undo &lt;i&gt;(Redo)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+Z&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Mengembalikan ke keadaan seperti sebelumnya &lt;i&gt;(Undo)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;F11&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : &lt;i&gt;Full Screen&lt;/i&gt;.

&lt;/div&gt;

&lt;br /&gt;

&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 15px; padding: 10px 15px 20px;-webkit-border-radius: 5px; border: 1px inset; margin: 15px; padding: 10px 15px 20px;&quot;&gt;

&lt;p style=&quot;text-align:center;margin:0px;font-weight:bold;&quot;&gt;Ms. Office&lt;/p&gt;
&lt;hr /&gt;

&lt;b&gt;&lt;i&gt;Ctrl+A&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Blok semua data dalam dokumen. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+B&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menebalkan huruf &lt;i&gt;(Bold)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+C&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menggandakan/Mengkopi data &lt;i&gt;(Copy)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+D&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Membuka format huruf. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+E&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Membuat teks rata tengah &lt;i&gt;(Center)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+F&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Mencari data &lt;i&gt;(Find)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+G&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Mencari halaman. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+H&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Mengganti nama data &lt;i&gt;(Replace)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+I&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Memiringkan huruf &lt;i&gt;(Italic)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+J&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Tulisan rata kiri kanan &lt;i&gt;(Justify)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+K&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menyisipkan Hyperlink. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+L&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Rata kiri &lt;i&gt;(Align Left)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+M&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Sama dengan &#39;tabulasi&#39; &lt;i&gt;(tambah indent)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+N&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Membuat lembar dokumen baru. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+O&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Membuka dokumen. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+P&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Mencetak tulisan &lt;i&gt;(Print)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+Q&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Mengatur tabulasi &lt;i&gt;(remove indent/kebalikan Ctrl+M)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+R&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Tulisan rata kanan &lt;i&gt;(Align Right)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+S&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menyimpan data. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+T&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Tabulasi. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+U&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Garis bawah &lt;i&gt;(Underline)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+V&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menggandakan data &lt;i&gt;(Paste)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+W&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menutup data. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+X&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Memotong data &lt;i&gt;(Cut)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+Y&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Redo &lt;i&gt;(Kebalikan dari Ctrl+Z)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+Z&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Undo &lt;i&gt;(Membatalkan perintah sebelumnya)&lt;/i&gt;.

&lt;/div&gt;

&lt;br /&gt;

&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 15px; padding: 10px 15px 20px;-webkit-border-radius: 5px; border: 1px inset; margin: 15px; padding: 10px 15px 20px;&quot;&gt;

&lt;p style=&quot;text-align:center;margin:0px;font-weight:bold;&quot;&gt;Open Office&lt;/p&gt;
&lt;hr /&gt;

&lt;b&gt;&lt;i&gt;Ctrl+A&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Blok semua data dalam dokumen. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+B&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menebalkan huruf &lt;i&gt;(Bold)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+C&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menggandakan/Mengkopi data &lt;i&gt;(Copy)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+D&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Garis bawah doble &lt;i&gt;(Underline Special)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+E&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Membuat teks rata tengah &lt;i&gt;(Center)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+F&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Mencari data &lt;i&gt;(Find)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+G&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Tabulasi. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+I&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Memiringkan huruf &lt;i&gt;(Italic)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+J&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Tulisan rata kiri kanan &lt;i&gt;(Justify)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+K&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menyisipkan Hyperlink. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+L&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Rata kiri &lt;i&gt;(Align Left)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+N&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Membuat lembar dokumen baru. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+O&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Membuka dokumen. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+P&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Mencetak tulisan &lt;i&gt;(Print)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+Q&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Close aplikasi &lt;i&gt;(Quit)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+R&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Tulisan rata kanan &lt;i&gt;(Align Right)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+S&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menyimpan data. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+U&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Garis bawah (Underline). &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+V&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menggandakan data &lt;i&gt;(Paste)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+W&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Menutup data. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+X&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Memotong data &lt;i&gt;(Cut)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+Y&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Redo &lt;i&gt;(Kebalikan dari Ctrl+Z)&lt;/i&gt;. &lt;br /&gt;
&lt;b&gt;&lt;i&gt;Ctrl+Z&lt;/i&gt;&lt;/b&gt; &amp;nbsp; : Undo &lt;i&gt;(Membatalkan perintah sebelumnya)&lt;/i&gt;.

&lt;/div&gt;


&lt;br /&gt;

&lt;p style=&quot;text-align:justify;margin:15px;border-top:#000 solid 1px;&quot;&gt;&lt;blink&gt;&lt;font style=&quot;color:red;&quot;&gt;&lt;b&gt;Nb.&lt;/b&gt;&lt;/font&gt;&lt;/blink&gt; &lt;i&gt;Silahkan Download Kumpulan Shortcut Keyboard dari A-Z (Lengkap) di atas dalam bentuk PDF di &lt;a href=&quot;http://adf.ly/wchmG&quot; target=&quot;_blank&quot;&gt;sini&lt;/a&gt;&lt;/i&gt;.&lt;/p&gt;


&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;</description><link>http://amirabella-zone.blogspot.com/2013/01/kumpulan-shortcut-keyboard-dari-z.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7WHdVjPezgFiRxarJMqLUFE5Z3Z6YNO6P9CSEVheJZj-OOeRvHPHQK0nm8p5_CcZjhpw3UHzou8zmw9pZ5RSrFSO7Z1WHOZySAMKgOhff_My14eUq_vS99VGsQJf6A9DNpDsySssMRJc/s72-c/Keyboard.png" height="72" width="72"/><thr:total>0</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-5505033694750330642</guid><pubDate>Sun, 13 Jan 2013 22:54:00 +0000</pubDate><atom:updated>2013-01-14T06:57:57.634+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Tips N&#39; Trik</category><title>Cara Convert PDF to Text Document</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjz6Yk5sSSRh8ecdHRgRS2ZO-pDdZFMf72cupYKaAXhyphenhyphenHtn6Xya8JGaVmiFkZV6m3nrduslKDyTmXd_t9MRR9QmzH-tbghx5uW0mAOfWK4gWglHBrQniQxqKZLHVrE59NNH-D7QN9Bz_7A/s1600/PdfToText.png&quot; imageanchor=&quot;1&quot; style=&quot;clear:left; float:left;margin-right:1em; margin-bottom:1em&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;150&quot; width=&quot;200&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjz6Yk5sSSRh8ecdHRgRS2ZO-pDdZFMf72cupYKaAXhyphenhyphenHtn6Xya8JGaVmiFkZV6m3nrduslKDyTmXd_t9MRR9QmzH-tbghx5uW0mAOfWK4gWglHBrQniQxqKZLHVrE59NNH-D7QN9Bz_7A/s320/PdfToText.png&quot; alt=&quot;Cara Convert PDF to Text Document&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Pada Posting sebelumnya saya share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/01/cara-convert-pdf-to-html-document.html&quot; style=&quot;text-decoration:none;&quot;&gt;&lt;i&gt;&amp;#39;Cara Convert PDF to HTML Document&amp;#39;&lt;/i&gt;&lt;/a&gt;, sekarang saya lanjutkan dengan share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/01/cara-convert-pdf-to-text-document.html&quot; style=&quot;text-decoration:none;&quot;&gt;&lt;i&gt;&amp;#39;Cara Convert PDF to Text Document&amp;#39;&lt;/i&gt;&lt;/a&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;PDF&lt;/b&gt; merupakan singkatan dari &lt;i&gt;(Portable Document Format)&lt;/i&gt;. File ini sangat populer dan banyak dijumpai di &lt;i&gt;internet&lt;/i&gt; khususnya pada saat kita mendownload sebuah &lt;i&gt;ebook&lt;/i&gt; maupun berbagai macam artikel dan jurnal, bahkan tugas kuliah pun terkadang diberikan dalam bentuk file &lt;i&gt;PDF&lt;/i&gt;. Karena suatu alasan tertentu, Anda ingin merubah atau &lt;i&gt;convert&lt;/i&gt; file &lt;i&gt;PDF&lt;/i&gt; tersebut menjadi &lt;i&gt;Text&lt;/i&gt; dokumen. Baiklah berikut ini langkah-langkahnya.
&lt;/p&gt;

&lt;br /&gt;

&lt;div&gt;
&lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;Screenshot &amp;amp; Langkah-langkah:&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

&lt;p style=&quot;text-align:justify;margin:15px;&quot;&gt;&lt;b&gt;&lt;u&gt;Cara Convert PDF to Text Document:&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;

&lt;ol style=&quot;margin-right:15px;&quot;&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;Download dan install aplikasi &lt;i&gt;PDF Converter&lt;/i&gt; di &lt;a href=&quot;http://www.mediafire.com/?m6xuxqgh1vym7qg&quot; target=&quot;_blank&quot;&gt;sini&lt;/a&gt;&lt;/li&gt;
     
 &lt;li style=&quot;text-align:justify&quot;&gt;Jalankan aplikasi &lt;i&gt;PDF Converter&lt;/i&gt;, kemudian ikuti langkah-langkah berikut ini:&lt;/li&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;
 Pada pilihan &lt;i&gt;select&lt;/i&gt; Anda klik &lt;b&gt;&lt;i&gt;&amp;#39;Text&amp;#39;&lt;/i&gt;&lt;/b&gt;, kemudian klik &lt;b&gt;&lt;i&gt;&amp;#39;Add Files...&amp;#39;&lt;/i&gt;&lt;/b&gt;, seperti pada gambar berikut ini.
&lt;/p&gt;

&lt;p&gt;
 &lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLrSTBPwRVNtm4xdK32B6p9z7Y2sdoXhSo88LV0GpwiwFoNV4Ui6CAiASwbWCYydMiok5p1zCXV_VeAM3r7xwyfU6RzxhG-YKuuBQT2swG_T2Bpw-HT7E1qJAFlQdrwl1sProV2NKQyxs/s1600/SS_PdfToText1.jpg&quot; imageanchor=&quot;1&quot; style=&quot;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;400&quot; width=&quot;389&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLrSTBPwRVNtm4xdK32B6p9z7Y2sdoXhSo88LV0GpwiwFoNV4Ui6CAiASwbWCYydMiok5p1zCXV_VeAM3r7xwyfU6RzxhG-YKuuBQT2swG_T2Bpw-HT7E1qJAFlQdrwl1sProV2NKQyxs/s400/SS_PdfToText1.jpg&quot; alt=&quot;Cara Convert PDF to Text Document&quot; /&gt;&lt;/a&gt;

&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;
 Lalu Anda &lt;i&gt;browse&lt;/i&gt; file yang akan di &lt;i&gt;convert&lt;/i&gt;, sebagai contoh di sini file &lt;i&gt;sample.pdf&lt;/i&gt; kemudian klik &lt;b&gt;&lt;i&gt;&amp;#39;Open&amp;#39;&lt;/i&gt;&lt;/b&gt;, seperti pada gambar di bawah ini. 
&lt;/p&gt;

&lt;p&gt;
 &lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3NlQrXVv1FRpGZ3Og2D2ogh_5mlDKSyilXOZPWhwxamjxJWYbpWnTZAyNnktjVh_-Rh0DNyZOBgrsq1o9fkMJPe28ayByX5OBpXHKPmOpBHeJSbAfP3gazYLlS8eurpgpqpERdNu3nbc/s1600/SS_PdfToText2.jpg&quot; imageanchor=&quot;1&quot; style=&quot;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;375&quot; width=&quot;400&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3NlQrXVv1FRpGZ3Og2D2ogh_5mlDKSyilXOZPWhwxamjxJWYbpWnTZAyNnktjVh_-Rh0DNyZOBgrsq1o9fkMJPe28ayByX5OBpXHKPmOpBHeJSbAfP3gazYLlS8eurpgpqpERdNu3nbc/s400/SS_PdfToText2.jpg&quot; alt=&quot;Cara Convert PDF to Text Document&quot; /&gt;&lt;/a&gt;

&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;
 Kemudian klik &lt;b&gt;&lt;i&gt;&amp;#39;Convert&amp;#39;&lt;/i&gt;&lt;/b&gt; lalu tunggu prosesnya sampai selesai, seperti pada gambar berikut ini. 
&lt;/p&gt;

&lt;p&gt;
 &lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_ZluwN6mXvyr44qPqLrQSlA2j6_m6ek_xf7Ms2Y9gbRhEGikRFtK5rwuPYid3JmpXZKA6ygQ60ab7TBfpnl8IlU7hawHZriem6oh01LcnTDRK955XDrMx44oJpiGDYZxj8oEuzUfoSiU/s1600/SS_PdfToText3.jpg&quot; imageanchor=&quot;1&quot; style=&quot;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;400&quot; width=&quot;389&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_ZluwN6mXvyr44qPqLrQSlA2j6_m6ek_xf7Ms2Y9gbRhEGikRFtK5rwuPYid3JmpXZKA6ygQ60ab7TBfpnl8IlU7hawHZriem6oh01LcnTDRK955XDrMx44oJpiGDYZxj8oEuzUfoSiU/s400/SS_PdfToText3.jpg&quot; alt=&quot;Cara Convert PDF to Text Document&quot; /&gt;&lt;/a&gt;

&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;
 Setelah proses &lt;i&gt;convert&lt;/i&gt; selesai kemudian Anda klik &lt;b&gt;&lt;i&gt;&amp;#39;OK&amp;#39;&lt;/i&gt;&lt;/b&gt;, seperti pada gambar di bawah ini.
&lt;/p&gt;

&lt;p&gt;
 &lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3aq8NPAX0TB2k2WzisFotZeHruQP-x5ZkiUJI8fDbwa10WfBWA1KA8PAjzQhTJytFkYxD1gKEAya2xqizyHqwbLG_SJPHrEnycHQPDlNKepyF-lHKwXcwalVFeKF-TvJpAtsScVYk7xE/s1600/SS_PdfToText4.jpg&quot; imageanchor=&quot;1&quot; style=&quot;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;400&quot; width=&quot;389&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3aq8NPAX0TB2k2WzisFotZeHruQP-x5ZkiUJI8fDbwa10WfBWA1KA8PAjzQhTJytFkYxD1gKEAya2xqizyHqwbLG_SJPHrEnycHQPDlNKepyF-lHKwXcwalVFeKF-TvJpAtsScVYk7xE/s400/SS_PdfToText4.jpg&quot; alt=&quot;Cara Convert PDF to Text Document&quot; /&gt;&lt;/a&gt;

&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;
 Untuk melihat file hasil &lt;i&gt;convert&lt;/i&gt; tersimpan silahkan Anda klik &lt;b&gt;&lt;i&gt;&amp;#39;Open&amp;#39;&lt;/i&gt;&lt;/b&gt;, seperti pada gambar berikut ini.
&lt;/p&gt;

&lt;p&gt;
 &lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkSdoqWXNtryJaUt0Bic0XaptKMzl0igWeRXIXB_KIAhChtW-W13v9TImLeZb8oK4QovmEuyq5wsYEZiT3EY0QRm6F_T4atfevaxY4dNTAFqXZkPDMx1rFE2_5zeHccpWVhivvFqcfIKs/s1600/SS_PdfToText5.jpg&quot; imageanchor=&quot;1&quot; style=&quot;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;400&quot; width=&quot;389&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkSdoqWXNtryJaUt0Bic0XaptKMzl0igWeRXIXB_KIAhChtW-W13v9TImLeZb8oK4QovmEuyq5wsYEZiT3EY0QRm6F_T4atfevaxY4dNTAFqXZkPDMx1rFE2_5zeHccpWVhivvFqcfIKs/s400/SS_PdfToText5.jpg&quot; alt=&quot;Cara Convert PDF to Text Document&quot; /&gt;&lt;/a&gt;

&lt;/p&gt;

 &lt;li style=&quot;text-align:justify&quot;&gt;&lt;b&gt;&lt;i&gt;Selesai..!!&lt;/i&gt;&lt;/b&gt; Anda telah berhasil meng&amp;#39;convert file &lt;i&gt;PDF&lt;/i&gt; menjadi dokumen &lt;i&gt;Text&lt;/i&gt;.&lt;/li&gt;
&lt;/ol&gt;

&lt;br /&gt;

&lt;p style=&quot;text-align:justify;margin:15px;border-top:#000 solid 1px;&quot;&gt;&lt;blink&gt;&lt;font style=&quot;color:red;&quot;&gt;&lt;b&gt;Nb.&lt;/b&gt;&lt;/font&gt;&lt;/blink&gt; &lt;i&gt;Apabila Anda ingin merubah tempat hasil convert tersimpan, silahkan customize pada &lt;b&gt;&amp;#39;Output Setting&amp;#39;&lt;/b&gt;&lt;/i&gt;.&lt;/p&gt;


&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;</description><link>http://amirabella-zone.blogspot.com/2013/01/cara-convert-pdf-to-text-document.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjz6Yk5sSSRh8ecdHRgRS2ZO-pDdZFMf72cupYKaAXhyphenhyphenHtn6Xya8JGaVmiFkZV6m3nrduslKDyTmXd_t9MRR9QmzH-tbghx5uW0mAOfWK4gWglHBrQniQxqKZLHVrE59NNH-D7QN9Bz_7A/s72-c/PdfToText.png" height="72" width="72"/><thr:total>0</thr:total></item><item><guid isPermaLink="false">tag:blogger.com,1999:blog-237919773872468803.post-2387944342108116286</guid><pubDate>Sun, 13 Jan 2013 22:40:00 +0000</pubDate><atom:updated>2013-01-14T06:46:14.252+08:00</atom:updated><category domain="http://www.blogger.com/atom/ns#">Tips N&#39; Trik</category><title>Cara Convert PDF to HTML Document</title><description>&lt;div class=&quot;separator&quot; style=&quot;clear: both; text-align: center;&quot;&gt;
&lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcMxK3sMKxkyKw29YgqhZgpEA2Vdstk6VWbl2M-1UjJ-1Ji_orYmz9F8FUihDbXu31xlsRd_DylP65w-FBaQTTzGQDOZSTqzfHrm0wmooHDITEkMT98u1NaRrf2pThJYkJesIlrPjGfKQ/s1600/PdfToHtml.png&quot; imageanchor=&quot;1&quot; style=&quot;clear:left; float:left;margin-right:1em; margin-bottom:1em&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;150&quot; width=&quot;200&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcMxK3sMKxkyKw29YgqhZgpEA2Vdstk6VWbl2M-1UjJ-1Ji_orYmz9F8FUihDbXu31xlsRd_DylP65w-FBaQTTzGQDOZSTqzfHrm0wmooHDITEkMT98u1NaRrf2pThJYkJesIlrPjGfKQ/s320/PdfToHtml.png&quot; alt=&quot;Cara Convert PDF to HTML Document&quot; /&gt;&lt;/a&gt;&lt;/div&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;Pada Posting sebelumnya saya share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/01/cara-convert-pdf-to-ms-powerpoint.html&quot; style=&quot;text-decoration:none;&quot;&gt;&lt;i&gt;&amp;#39;Cara Convert PDF to Ms. PowerPoint Document&amp;#39;&lt;/i&gt;&lt;/a&gt;, sekarang saya lanjutkan dengan share &lt;a href=&quot;http://amirabella-zone.blogspot.com/2013/01/cara-convert-pdf-to-html-document.html&quot; style=&quot;text-decoration:none;&quot;&gt;&lt;i&gt;&amp;#39;Cara Convert PDF to HTML Document&amp;#39;&lt;/i&gt;&lt;/a&gt;.
&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;&lt;b&gt;PDF&lt;/b&gt; merupakan singkatan dari &lt;i&gt;(Portable Document Format)&lt;/i&gt;. File ini sangat populer dan banyak dijumpai di &lt;i&gt;internet&lt;/i&gt; khususnya pada saat kita mendownload sebuah &lt;i&gt;ebook&lt;/i&gt; maupun berbagai macam artikel dan jurnal, bahkan tugas kuliah pun terkadang diberikan dalam bentuk file &lt;i&gt;PDF&lt;/i&gt;. Karena suatu alasan tertentu, Anda ingin merubah atau &lt;i&gt;convert&lt;/i&gt; file &lt;i&gt;PDF&lt;/i&gt; tersebut menjadi dokumen &lt;i&gt;HTML&lt;/i&gt;. Baiklah berikut ini langkah-langkahnya.
&lt;/p&gt;

&lt;br /&gt;

&lt;div&gt;
&lt;div style=&quot;margin-bottom: 2px;&quot;&gt;
&lt;span style=&quot;font-size: large;&quot;&gt;&lt;b&gt;Screenshot &amp;amp; Langkah-langkah:&lt;/b&gt;&lt;/span&gt;
&lt;input onclick=&quot;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;Tutup&#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;Buka&#39;; }&quot; style=&quot;font-size: 10px; margin: 0px; padding: 0px; width: 60px;&quot; type=&quot;button&quot; value=&quot;Buka&quot; /&gt;&lt;/div&gt;
&lt;div style=&quot;-moz-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;-webkit-border-radius: 5px; border: 1px inset; margin: 0px; padding: 10px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

&lt;p style=&quot;text-align:justify;margin:15px;&quot;&gt;&lt;b&gt;&lt;u&gt;Cara Convert PDF to HTML Document:&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;

&lt;ol style=&quot;margin-right:15px;&quot;&gt;
 &lt;li style=&quot;text-align:justify&quot;&gt;Download dan install aplikasi &lt;i&gt;PDF Converter&lt;/i&gt; di &lt;a href=&quot;http://www.mediafire.com/?m6xuxqgh1vym7qg&quot; target=&quot;_blank&quot;&gt;sini&lt;/a&gt;&lt;/li&gt;
     
 &lt;li style=&quot;text-align:justify&quot;&gt;Jalankan aplikasi &lt;i&gt;PDF Converter&lt;/i&gt;, kemudian ikuti langkah-langkah berikut ini:&lt;/li&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;
 Pada pilihan &lt;i&gt;select&lt;/i&gt; Anda klik &lt;b&gt;&lt;i&gt;&amp;#39;HTML&amp;#39;&lt;/i&gt;&lt;/b&gt;, kemudian klik &lt;b&gt;&lt;i&gt;&amp;#39;Add Files...&amp;#39;&lt;/i&gt;&lt;/b&gt;, seperti pada gambar berikut ini.
&lt;/p&gt;

&lt;p&gt;
 &lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgA6CtvPmn2fWwcjBmpwDXFX_7f83eS4pvFsiq_GMHAltysqn9BqaGbUYEWyo1jkT3uoNJmWz181KYMkhWzRC_szXm9F-tHT6pCpDJR2b5k3oA0XzC8zNNeelJSe0MgM0HvnBzUaKsWWMA/s1600/SS_PdfToHtml1.jpg&quot; imageanchor=&quot;1&quot; style=&quot;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;400&quot; width=&quot;389&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgA6CtvPmn2fWwcjBmpwDXFX_7f83eS4pvFsiq_GMHAltysqn9BqaGbUYEWyo1jkT3uoNJmWz181KYMkhWzRC_szXm9F-tHT6pCpDJR2b5k3oA0XzC8zNNeelJSe0MgM0HvnBzUaKsWWMA/s400/SS_PdfToHtml1.jpg&quot; alt=&quot;Cara Convert PDF to HTML Document&quot; /&gt;&lt;/a&gt;

&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;
 Lalu Anda &lt;i&gt;browse&lt;/i&gt; file yang akan di &lt;i&gt;convert&lt;/i&gt;, sebagai contoh di sini file &lt;i&gt;sample.pdf&lt;/i&gt; kemudian klik &lt;b&gt;&lt;i&gt;&amp;#39;Open&amp;#39;&lt;/i&gt;&lt;/b&gt;, seperti pada gambar di bawah ini. 
&lt;/p&gt;

&lt;p&gt;
 &lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhU5-28EJ8cyI2z85AO6UJkGGtrYhzIUWK2Mg1DUFAhVW_mKywpoYC_mImGyDWNl9euOaIZJbEaYb-mt_hil4sJltKCMeWjdU1bmMwdwHzDeJPyosqE1sed5pjmDpbQ5qivqP_i-WQsnrk/s1600/SS_PdfToHtml2.jpg&quot; imageanchor=&quot;1&quot; style=&quot;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;375&quot; width=&quot;400&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhU5-28EJ8cyI2z85AO6UJkGGtrYhzIUWK2Mg1DUFAhVW_mKywpoYC_mImGyDWNl9euOaIZJbEaYb-mt_hil4sJltKCMeWjdU1bmMwdwHzDeJPyosqE1sed5pjmDpbQ5qivqP_i-WQsnrk/s400/SS_PdfToHtml2.jpg&quot; alt=&quot;Cara Convert PDF to HTML Document&quot; /&gt;&lt;/a&gt;

&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;
 Kemudian klik &lt;b&gt;&lt;i&gt;&amp;#39;Convert&amp;#39;&lt;/i&gt;&lt;/b&gt; lalu tunggu prosesnya sampai selesai, seperti pada gambar berikut ini. 
&lt;/p&gt;

&lt;p&gt;
 &lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgamocet_bdmWWBjfaB5UdBkr53J948FVBFZ2FkYC7FXJJV8ic8mW3Kz-r0l548iUFTMqRGkAmBHKmN42tQZoUa4dLjajjSsn7RhUsnCgxptTeiznNRfwqmiLQ8mrUInG-px4cEp59_RqY/s1600/SS_PdfToHtml3.jpg&quot; imageanchor=&quot;1&quot; style=&quot;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;400&quot; width=&quot;389&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgamocet_bdmWWBjfaB5UdBkr53J948FVBFZ2FkYC7FXJJV8ic8mW3Kz-r0l548iUFTMqRGkAmBHKmN42tQZoUa4dLjajjSsn7RhUsnCgxptTeiznNRfwqmiLQ8mrUInG-px4cEp59_RqY/s400/SS_PdfToHtml3.jpg&quot; alt=&quot;Cara Convert PDF to HTML Document&quot; /&gt;&lt;/a&gt;

&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;
 Setelah proses &lt;i&gt;convert&lt;/i&gt; selesai kemudian Anda klik &lt;b&gt;&lt;i&gt;&amp;#39;OK&amp;#39;&lt;/i&gt;&lt;/b&gt;, seperti pada gambar di bawah ini.
&lt;/p&gt;

&lt;p&gt;
 &lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglVg7VZDADQ87AKOVxapKIIuLRGYzsPYem9zTaWxMB7jGTpiY2CLCs8vO4zbcknRXUGfPuG2nlNpiKM5HCy4KqdW9UzM6bD0DIPrKgXQzmmKIYrv5Bn7jZrXXrshlybI4RLI6WnAwmpOM/s1600/SS_PdfToHtml4.jpg&quot; imageanchor=&quot;1&quot; style=&quot;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;400&quot; width=&quot;389&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglVg7VZDADQ87AKOVxapKIIuLRGYzsPYem9zTaWxMB7jGTpiY2CLCs8vO4zbcknRXUGfPuG2nlNpiKM5HCy4KqdW9UzM6bD0DIPrKgXQzmmKIYrv5Bn7jZrXXrshlybI4RLI6WnAwmpOM/s400/SS_PdfToHtml4.jpg&quot; alt=&quot;Cara Convert PDF to HTML Document&quot; /&gt;&lt;/a&gt;

&lt;/p&gt;

&lt;p style=&quot;text-align:justify;&quot;&gt;
 Untuk melihat file hasil &lt;i&gt;convert&lt;/i&gt; tersimpan silahkan Anda klik &lt;b&gt;&lt;i&gt;&amp;#39;Open&amp;#39;&lt;/i&gt;&lt;/b&gt;, seperti pada gambar berikut ini.
&lt;/p&gt;

&lt;p&gt;
 &lt;a href=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQ-C9EWjWScHTeGKnP9nw_vpRyXCf8k0l-xQn2PZ7vMg0LOV_8phof5AeDCVSDnSQGoeLwmsKdRqW0XvY3dDLZOvlGqJtxuCpzFe_yuIu4o9lmcz1uQG_uKVs13y1-1jhjnwMGaesHZeQ/s1600/SS_PdfToHtml5.jpg&quot; imageanchor=&quot;1&quot; style=&quot;&quot;&gt;&lt;img border=&quot;0&quot; height=&quot;400&quot; width=&quot;389&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQ-C9EWjWScHTeGKnP9nw_vpRyXCf8k0l-xQn2PZ7vMg0LOV_8phof5AeDCVSDnSQGoeLwmsKdRqW0XvY3dDLZOvlGqJtxuCpzFe_yuIu4o9lmcz1uQG_uKVs13y1-1jhjnwMGaesHZeQ/s400/SS_PdfToHtml5.jpg&quot; alt=&quot;Cara Convert PDF to HTML Document&quot; /&gt;&lt;/a&gt;

&lt;/p&gt;

 &lt;li style=&quot;text-align:justify&quot;&gt;&lt;b&gt;&lt;i&gt;Selesai..!!&lt;/i&gt;&lt;/b&gt; Anda telah berhasil meng&amp;#39;convert file &lt;i&gt;PDF&lt;/i&gt; menjadi dokumen &lt;i&gt;HTML&lt;/i&gt;.&lt;/li&gt;
&lt;/ol&gt;

&lt;br /&gt;

&lt;p style=&quot;text-align:justify;margin:15px;border-top:#000 solid 1px;&quot;&gt;&lt;blink&gt;&lt;font style=&quot;color:red;&quot;&gt;&lt;b&gt;Nb.&lt;/b&gt;&lt;/font&gt;&lt;/blink&gt; &lt;i&gt;Apabila Anda ingin merubah tempat hasil convert tersimpan, silahkan customize pada &lt;b&gt;&amp;#39;Output Setting&amp;#39;&lt;/b&gt;&lt;/i&gt;.&lt;/p&gt;


&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;</description><link>http://amirabella-zone.blogspot.com/2013/01/cara-convert-pdf-to-html-document.html</link><author>noreply@blogger.com (Anonymous)</author><media:thumbnail xmlns:media="http://search.yahoo.com/mrss/" url="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcMxK3sMKxkyKw29YgqhZgpEA2Vdstk6VWbl2M-1UjJ-1Ji_orYmz9F8FUihDbXu31xlsRd_DylP65w-FBaQTTzGQDOZSTqzfHrm0wmooHDITEkMT98u1NaRrf2pThJYkJesIlrPjGfKQ/s72-c/PdfToHtml.png" height="72" width="72"/><thr:total>0</thr:total></item></channel></rss>