Senin, 28 Januari 2019

Kode Untuk Menciptakan Kalkulator Dengan Java Html Css Keren

Hallo teman blog indo di artikel kali ini aku akan bagikan mengenai aplikasi Kalkulator yang di buat dengan memakai Html, Java dan JavaScript, namun tahap pembuatan Kalkulator ini yang aku bagikan masih ada banyak kekurangan gan, di artikel ini bila agan membukanya berarti sangat cocok untuk pembelajaran agan dengan sebuah jadwal coding yang berjulukan HTML ! ,hehe


Di bawah ini script aba-aba kalkulator untuk menciptakan aplikasi dengan basic yang akan agan terapkan pada mata pelajaran kuliah, kiprah kuliah, maupun pola skripsi bagi anak it.


<html> <head> <style type="text/css">  * {     margin: 0;     padding: 0;     box-sizing: border-box;         font: bold 14px Arial, sans-serif; }  html {     height: 100%;     background: white;     background: radial-gradient(circle, #E6E6FA 20%, #ccc);     background-size: cover; }  #calculator {     width: 325px;     height: auto;         margin: 10px auto;     padding: 20px 20px 9px;         background: #008000;     background: linear-gradient(#008000, #ADFF2F);     border-radius: 3px;     box-shadow: 0px 4px #808080, 0px 10px 15px rgba(0, 0, 0, 0.2); }  .top span.clear {     float: left; }  .top .screen {     height: 40px;     width: 212px;        float: right;        padding: 0 10px;        background: rgba(0, 0, 0, 0.2);     border-radius: 3px;     box-shadow: inset 0px 4px rgba(0, 0, 0, 0.2);     font-size: 17px;     line-height: 40px;     color: white;     text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);     text-align: right;     letter-spacing: 1px; }  .keys, .top {overflow: hidden;} .keys span, .top span.clear {     float: left;     position: relative;     top: 0;         cursor: pointer;         width: 66px;     height: 36px;         background: Lightseagreen;     border-radius: 3px;     box-shadow: 0px 4px rgba(0, 0, 0, 0.2);         margin: 0 7px 11px 0;         color: #888;     line-height: 36px;     text-align: center;         user-select: none;     transition: all 0.2s ease; } .keys span.operator {     background: #87CEEB;     margin-right: 0; }  .keys span.eval {     background: #00FF7F;     box-shadow: 0px 4px #9da853;         color: #888e5f; }  .top span.clear {     background: #40E0D0;     box-shadow: 0px 4px #708090;     color: white; }  /* Some hover effects */ .keys span:hover {     background: #9c89f6;     box-shadow: 0px 4px #6b54d3;     color: white; }  .keys span.eval:hover {     background: #abb850;     box-shadow: 0px 4px #717a33;     color: #ffffff; }  .top span.clear:hover {     background: #f68991;     box-shadow: 0px 4px #d3545d;     color: white; }  .keys span:active {     box-shadow: 0px 0px #6b54d3;     top: 4px; }  .keys span.eval:active {     box-shadow: 0px 0px #717a33;     top: 4px; }  .top span.clear:active {     top: 4px;     box-shadow: 0px 0px #d3545d; } </style> </head> <body> <div id="calculator">     <!-- Screen and clear key -->     <div class="top">         <span class="clear">C</span>         <div class="screen"></div>     </div>         <div class="keys">         <!-- operators and other keys -->         <span>7</span>         <span>8</span>         <span>9</span>         <span class="operator">+</span>         <span>4</span>         <span>5</span>         <span>6</span>         <span class="operator">-</span>         <span>1</span>         <span>2</span>         <span>3</span>         <span class="operator">÷</span>         <span>0</span>         <span>.</span>         <span class="eval">=</span>         <span class="operator">x</span>     </div> </div>  <!-- PrefixFree --> <script type="text/javascript"> var keys = document.querySelectorAll('#calculator span'); var operators = ['+', '-', 'x', '÷']; var decimalAdded = false;  for(var i = 0; i < keys.length; i++) {     keys[i].onclick = function(e) {         var input = document.querySelector('.screen');         var inputVal = input.innerHTML;         var btnVal = this.innerHTML;                 if(btnVal == 'C') {             input.innerHTML = '';             decimalAdded = false;         }                 else if(btnVal == '=') {             var equation = inputVal;             var lastChar = equation[equation.length - 1];             equation = equation.replace(/x/g, '*').replace(/÷/g, '/');             if(operators.indexOf(lastChar) > -1 || lastChar == '.')                 equation = equation.replace(/.$/, '');                         if(equation)                 input.innerHTML = eval(equation);                             decimalAdded = false;         }                 else if(operators.indexOf(btnVal) > -1) {             var lastChar = inputVal[inputVal.length - 1];             if(inputVal != '' && operators.indexOf(lastChar) == -1)                  input.innerHTML += btnVal;                        else if(inputVal == '' && btnVal == '-')                  input.innerHTML += btnVal;             if(operators.indexOf(lastChar) > -1 && inputVal.length > 1) {                 input.innerHTML = inputVal.replace(/.$/, btnVal);             }                        decimalAdded =false;         }                else if(btnVal == '.') {             if(!decimalAdded) {                 input.innerHTML += btnVal;                 decimalAdded = true;             }         }         else {             input.innerHTML += btnVal;         }         e.preventDefault();     }  } </script> </body> </html>  


Namun bila tidak suka dengan warna atau kotak kotak tampilan kalkulator menyerupai demo di atas, agan dapat edit edit dengan html pada post blog dengan perlahan, baik dari gradasi warna, bentuk dan lain sebagainya.

Cukup sekian artikel yang aku bagikan script aba-aba kalkulator ini, supaya membantu.

Rabu, 16 Januari 2019

Cara Buat Tombol Kotak Komentar Blogger Buka Tutup Keren

Cara menciptakan tombol Buka Tutup / Show Hide di komentar blog - Pada post artikel kali ini ane akan bagikan cara menciptakan tombol komentar buka tutup menyerupai yang ane pake di template mas adhy kompiflexiblle ini, tetapi ini memakai warna bergradasi keren loh gan.

Widget kotak komentar ini sangatlah bermanfaat untuk semua pengunjung yang nantinya bakal menjadi blog anda menggambarkan ramai di kunjungi dan menambah kualitas blog.


Dengan menambahkan widget komentar blog yang disembunyikan atau dapat di buka tutup. Bisa meringankan blog ketika load d semua perangkat loh, dan pastinya memaksimalkan pengunjung juga gan.

Berikut ialah tutorial cara buat tombol buka tutup kotak komentar blogger.

Cara Terbaru Membuat Tombol Buka Tutup Komentar dengan Gradient


Seperti halnya mengedit di html caranya agan Buka Dashboard Blogger - Pilih Tema - Klik Edit HTML,lalu copy dan pastekan arahan dibawah ini diatas arahan </style> atau ]]></b:skin>. Kalian pilih salah satu mana yang cocok ditemplate blog anda.


  
/* CSS Tombol Buka Tutup Komen */
.buka-komen,.tutup-komen{font-family:inherit;background: linear-gradient(to right, #38b3e0, #e53bb2);color:#fff;font-size:16px;line-height:1.3em;padding:8px 10px;text-align:center;font-weight:700;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;-webkit-transition:all 218ms;-moz-transition:all 218ms;-o-transition:all 218ms;transition:all 218ms;-webkit-user-select:none;-moz-user-select:none;margin:10px 5px 5px 5px;cursor:pointer;}
.buka-komen{display:block;margin-bottom:20px}
#comments-box{display:none}

Agan juga dapat mengedit warna yang berupa arahan html color di css dengan mengubahnya sesuka agan pada arahan #38b3e0, #e53bb2 untuk mengeditnya.

Kemudian cari arahan menyerupai yang menyerupai di bawah ini

 <b:if cond='data:blog.pageType == &quot;static_page&quot;'>               <b:if cond='data:post.showThreadedComments'>                 <b:include data='post' name='comments'/>               <b:else/>                 <b:include data='post' name='comments'/>               </b:if>             </b:if> 

Jika agan menemukan arahan yang sama menyerupai yang menyerupai diatas, anda pilih arahan yang di bawahnya dan ganti dengan arahan di bawah ini.

  
<b:if cond='data:blog.pageType == &quot;item&quot;'>
    <div aria-label='Buka Komentar' class='buka-komen' id='buka-komen' onclick='document.getElementById(&quot;comments-box&quot;).style.display=&quot;block&quot;;document.getElementById(&quot;tutup-komen&quot;).style.display=&quot;block&quot;;document.getElementById(&quot;buka-komen&quot;).style.display=&quot;none&quot;' role='button' tabindex='0'>Click to Comment!</div>
    <div aria-label='Tutup Komentar' class='tutup-komen' hidden='hidden' id='tutup-komen' onclick='document.getElementById(&quot;comments-box&quot;).style.display=&quot;none&quot;;document.getElementById(&quot;tutup-komen&quot;).style.display=&quot;none&quot;;document.getElementById(&quot;buka-komen&quot;).style.display=&quot;block&quot;' role='button' tabindex='0'>Close Comment!</div>
    </b:if>
    <div id='comments-box'>
            <b:include cond='data:blog.pageType in {&quot;static_page&quot;,&quot;item&quot;}' data='post' name='comments'/>
              </div>
 Nah, kini sudah simpulan gan cara buatnya, gimana? mudahkan , supaya dengan cara ini untuk menciptakan buka tutup komentar postingan artikel blog anda menjadi fast load dan pastinya keren.

Selasa, 15 Januari 2019

Contoh Desain Skema Rumah Sederhana 2 Lantai

Rumah yaitu kini daerah dimana orang orang dapat menikmati kesukaan untuk di huni dan sebagai daerah tinggal di bumi yang sementara, untuk memenuhi standar rumah pastinya memerlukan sebuah lokasi untuk letak yang cukup untuk tinggali sekeluarga, baik banyak kamar, kamar 2 atau 3,  berlantai 2 3 dan sejenisnya.



Dari sebuah rumah yang ingin di bangkit harus memnuhi juga struktur pembangunan ibarat pondasi, plester lantai, tembok yang kuat, atap dan lainnya. Maka dari itu aku akan memperlihatkan beberapa pola skema rumah yang nantinya tidak begitu luas atau rumah minimalis yang di desain juga 2 lantai,.

Untuk membangun sebuah rumah pastinya harus memerlukan spek materi yang banyak dan juga material materi bahan untuk memenuhi kualitas rumah yang baik dan kokoh untuk di jual belikan maupun untuk kebutuhan sendiri.

Silahkan anda ambil file berikut ini berupa format pdf yang nantinya dapat buat anda rujukan atau pola desain rumah.



















Silahkan Lihat lihat pola tersebut, agar dapat membantu anda untuk mengakibatkan sebuah perumahan atau bangunan yang lebih indah.

Contoh Permintaan Ranting Program Triwulan Ipnu Ippnu

Contoh permintaan ranting dalam program triwulan - Triwulan atau program keagamaan sering di sebut triwulan bagi orang orang nu atau jaman dahulu yang berarti tiga.


Silahkan lihat pola di bawah ini permintaan untuk ranting dalam rangka program triwulan semseter ipnu ippnu yang selalu hidup terus organisasi ini.

Ganti Pojok kanan dan pojok kiri dengan logo ipnu dan ippnu.





PANITIA KEGIATAN TRIWULAN
PIMPINAN RANTING
IKATAN PELAJAR NAHDLATUL ULAMA’ (IPNU)
IKATAN PELAJAR PUTRI NAHDLATUL ULAMA’ (IPPNU)
DESA TEGALARUM KEC. MRANGGEN KAB. DEMAK

Sekretariat : Jln. Kauman Desa Tegalarum Mranggen Demak 59567, HP. 089620399853/08993956682
Nomor             : 002/Pan. Triwulan/PR/A/7354-7455/XII/2015
Hal                   : Undangan

Kepada
Yth. Pimpinan Ranting IPNU-IPPNU
Desa Batursari Mranggen Demak
Di Tempat

Assalamualaikum.Wr. Wb
Segala puji bagi Allah SWT yang telah melimpahkan rahmat dan hidayah-Nya, supaya kita selalu dalam limpahan iktikad dan keindahan bertawakkal kepada-Nya. Shalawat dan salam supaya senantiasa tercurah kepada Rasulullah Muhammad SAW, keluarga, sahabat, dan para pengikutnya yang tetap istiqamah hingga tamat zaman.
            Sehubungan dengan ini, kami selaku Panitia Triwulan IPNU-IPPNU Ranting Tegalarum bermaksud mengundang Rekan/ita untuk hadir dan ikut berpartisipasi pada acara tersebut, dengan tema “Membingkai Semangat Remaja Masa Kini dalam Meneladani Akhlak Nabi” yang Insya’ Allah akan diselenggarakan pada:
            Hari, tanggal   : Minggu, 20 Desember 2015 
            Waktu             : 13.00 WIB s.d.selesai
            Tempat            : Masjid Jami Baitul MuttaqinTegalarum
Acara               : Triwulan IPNU-IPPNU Ranting Tegalarum
Demikian surat ini kami sampaikan, atas kehadiran dan partisipasinya kami ucapkan terimakasih.
Wassalamualaikum. Wr. Wb


Panitia Kegiatan Triwulan

Ketua Panitia

Sekretaris





Muhammad Amirullah

Ludwina Jauharil Farra




Mengetahui,
Pimpinan Ranting
IPNU-IPPNU Desa Tegalarum

Ketua IPNU

Ketua IPPNU





Mushonif

Rina Linda Sari



Sabtu, 12 Januari 2019

Kisi Kisi Usbn Sma Ma Smk Tahun Fatwa 2019

Ujian sekolah berstandar nasional yang nantinya di sebut USBN Di jenjang Sekolah Menengan Atas MA tahun aliran 2019 bagi siswa siswi yang akan melaksanakan ujian untuk standar kompetensi kelulusan biar memperoleh prestasi akademik yang maksimal dengan ini aku bagikan kisi kisi mata pelajaran bahasa indonesia, kewarganegaraan dan masih banyak lagi untuk Sekolah Menengan Atas MA Sekolah Menengah kejuruan maka dari itu kalian dapat unduh filenya untuk di pelajari di kurikulum k13 ini dan memperoleh hasil maksimal.


Mata Pelajaran :

Bahasa Indonesia Pdf

IBB Bahasa Sastra Inggris

Sejarah (Peminatan)

Ekonomi IPS

Matematika (Wajib)

Biologi IPA

Kimia IPA

Matematika (Peminatan)

Sejarah Indonesia (Wajib)

Seni Budaya (Seni Rupa)

Silahkan ambil sesuai kebutuhan, kalau ingin request kisi kisi lain silahkan hubungi di kontak atau di kolom komentar bawah.

Kamis, 10 Januari 2019

Cara Ketahui Umur Pc Laptop Notebook Komputer

Cara ketahui umur pc laptop notebook komputer - Untuk Mengetahui Umur Komputer atau Laptop atau Notebook sangat lah penting kalau hendak akan membeli Komputer/Leptop/notebook Second. Sebelum melaksanakan pembelian tersebut kita cek terlebih dahulu, semoga kita tau, bahwa komputer/leptop/notebook tersebut memiliki perangkat gres atau sudah lama.
Untuk Cara Mengetahui Umur Komputer atau Laptop atau Notebook kita simak sebagai berikut:

1. Yang harus dilakukan yakni jalankan aktivitas CMD, dapat ketik diwindows CMD atau tekan Windows+R

2. Setelah terbukanya CMD, ketik debug lalu enter

3. Ketik df000:fff5 lalu enter, maka akan muncul menyerupai gambar dibawah ini: