oleh : Muchamad Eki S.A., S.Kom. M.M.

Kampus SMK Negeri 1 Panyingkiran

Alamat : Jalan Kirapandak Desa Karyamukti Kecamatan Panyingkiran Kabupaten Majalengka Provinsi Jawa Barat 45459.

Praktik Kompetensi Keahlian

Praktik Kompetensi Keahlian di SMK Negeri 1 Panyingkiran (TKJ, RPL, MM, TP4, ELIN, KIMIN, BB, TKR)

Materi Pembelajaran Simulasi Digital

Blog ini membahas materi pembelajaran Simulasi Digital untuk kelas 10 TIK SMK.

Mengetik 10 Jari

Salah satu materi bahasan Simulasi Digital yang akan disampaikan.

Perangkat Lunak Pengolah Kata

Salah satu materi bahasan Simulasi Digital yang akan disampaikan.

Presentasi Video

Presentasi Video merupakan salah satu materi bahasan untuk membuat presentasi berbentuk video.

Pengolah Angka

Pengolah Angka (Spreadsheet) merupakan salah satu materi bahasan untuk membuat dokumen dalam bentuk worksheet.

Galeri Video Tutorial

Galeri Video Tutorial disediakan sebagai alat bantu untuk memahami materi bahasan dalam berbentuk video.

Kegiatan Ekstrakurikuler

Galeri Foto Kegiatan Ekstrakurikuler di SMKN 1 Panyingkiran.

Mengerjakan Tugas Diskusi

Salah satu aktifitas siswa dalam KBM.

Kelas Maya

Salah satu materi yang dibahas dalam materi pembelajaran simulasi digital.

Source Code Menu Pull Down

Artikel berupa Source Code untuk membuat Menu Pull Down dalam Blog Simulasi Digital.

Selamat Datang di Blog SMK Negeri 1 Panyingkiran untuk Materi Pembelajaran Simulasi Digital
  • Images 1

       Blog Mapel Simulasi Digital

        Oleh : Muchamad Eki S. A., S.Kom. M.M.
  • Images 2

       Mengetik 10 Jari

        Salah satu bahasan dalam Mapel Simulasi Digital
  • Images 3

       Kelas Maya

        Mempelajari materi menggunakan aplikasi elearning
  • Images 4

       Pengolah Kata

        Salah satu materi bahasan dalam latihan mengetik naskah/dokumen
  • Images 5

       Kegiatan Diskusi

        Cuplikan hasil karya siswa dalam presentasi video



Wednesday, February 14, 2018

CSS Menu Drop Down

CSS Menu Drop down Blog Simulasi Digital

Untuk membuat menu drop down dengan css pada Blog Simulasi Digital ini menggunakan source code yang dibuat terpisah dari Blog template nya.






- - -
Source code nya adalah sebagai berikut :




- - - -

<!doctype html>

 <style type="text/css">
  body {
   margin:0;
   padding:0;
   line-height: 1.5;
  }
  .menu-wrapper {
   margin:10px auto;
   position: relative;
   width:700px;
  }
  .menu-wrapper ul{
   margin:0;
   padding:0;
   background-color: #333;
  }
   ul.menu-horizontal {
    width:100%;
    position: relative;
   }
   ul.menu-horizontal li {
    list-style: none;
   }
   /*Style menu horizontal*/
   ul.menu-horizontal >li{
    display: inline-block;
   }
   ul.menu-horizontal li a{
    position: relative;
    display: block;
    padding:10px 20px;
    text-decoration: none;
    color:#eee;
   }
   ul.menu-horizontal li a:hover {
    background-color:#4db2ec;
    -webkit-transition:all 0.5s ease-in-out;
   }
   /*Style Tanda panah pada menu yang mempunyai sub menu*/
   ul.menu-horizontal >li >a >span.arrow {
    width:0;
    height: 0;
    border:5px solid transparent;
    border-top:7px solid #eee;
    position: absolute;
    right: 5px;
    top:17px;
    z-index:
   }
  
   /*Style tanda panah pada sub menu level 1 dan level 2*/
   ul.menu-horizontal li ul li span.arrow {
    width:0;
    height: 0;
    border:5px solid transparent;
    border-left:7px solid #eee;
    position: absolute;
    right: 5px;
    top:17px;
    z-index:
   }
  
  
   /*Menyembunyikan sub menu ketika tidak dihover*/
   ul.submenu {
    position: absolute;
    display: none;
   }
  
   ul.submenu li {
    position: relative;
   }
  
   /*untuk menciptakan efek animasi ketika dihover*/
   @-webkit-keyframes mantul-vertikal {
    0%{top: -300px;opacity: 0;}
    50%{top: 120%;opacity: 1;}
    75%{top: 80%;opacity: 1;}
    100%{opacity: 1;top:100%;}
   }
   @keyframes mantul-vertikal {
    0%{top: -300px;opacity: 0;}
    50%{top: 120%;opacity: 1;}
    75%{top: 80%;opacity: 1;}
    100%{opacity: 1;top:100%;}
   }
   @-webkit-keyframes mantul-horizontal {
    0%{left:300%;opacity: 0}
    50%{left: 80%;opacity: 1;}
    75%{left: 110%;opacity: 1;}
    100%{left:100%;opacity: 1}
   }
   @keyframes mantul-horizontal {
    0%{left:300%;opacity: 0}
    50%{left: 80%;opacity: 1;}
    75%{left: 110%;opacity: 1;}
    100%{left:100%;opacity: 1}
   }
    
   /*Menampilkan sub menu level 1 ketika menu di hover*/
   ul.menu-horizontal li:hover ul.level-1 {
    min-width: 150px;
    display: block;
    top:100%;
    -webkit-animation:mantul-vertikal 1s;
    animation:mantul-vertikal 1s;
   }
  
   /*Menampilkan sub menu level 1 ketika menu di hover*/
   ul.menu-horizontal li ul li:hover ul.level-2 {
    min-width: 150px;
    display: block;
    -webkit-animation:mantul-horizontal 1s;
    animation:mantul-horizontal 1s;
    top:0;
    left:100%;
   }
 </style>


<div class="menu-wrapper">
<ul class="menu-horizontal">

<li><a href="#">Materi 1<span class="arrow"></span></a>
  <ul class="submenu level-1">

  <li><a href="http://simulasidigital-muchamadekisa.blogspot.co.id/2017/02/materi-bahasan-simulasi-digital.html">Materi Bahasan</a>
  </li>
  <li><a href="http://simulasidigital-muchamadekisa.blogspot.co.id/2017/02/mengetik-10-jari.html">Mengetik 10 Jari</a>
  </li>

  <li><a href="#">Pengolah Kata<span class="arrow"></span></a>
    <ul class="submenu level-2">
    <li><a href="http://simulasidigital-muchamadekisa.blogspot.co.id/2017/02/pengolah-kata.html">Pengertian, Fungsi dan Contohnya</a></li>
    <li><a href="http://simulasidigital-muchamadekisa.blogspot.co.id/2017/05/pengunaan-shortcut-pada-keyboard-dalam.html">Penggunaan Shortcut pada Keyboard</a></li>
    </ul>
  </li>

  <li><a href="#">Pengolah Angka<span class="arrow"></span></a>
    <ul class="submenu level-2">
    <li><a href="http://simulasidigital-muchamadekisa.blogspot.co.id/2017/02/pengolah-angka.html">Pengertian, Fungsi dan Contohnya</a></li>
    </ul>
  </li>

  <li><a href="#">Komunikasi Daring<span class="arrow"></span></a>
    <ul class="submenu level-2">
    <li><a href="#">Pengertian, Fungsi dan Contohnya</a></li>
    </ul>
  </li>

  </ul>
</li>

<li><a href="#">Materi 2<span class="arrow"></span></a>
  <ul class="submenu level-1">

  <li><a href="#">Kelas Maya<span class="arrow"></span></a>
    <ul class="submenu level-2">
    <li><a href="#">Pengertian, Fungsi dan Contohnya</a></li>
    </ul>
  </li>

  <li><a href="#">Presentasi Video<span class="arrow"></span></a>
    <ul class="submenu level-2">
    <li><a href="http://simulasidigital-muchamadekisa.blogspot.co.id/2017/02/pengertian-presentasi-video-fungsi-dan.html">Pengertian, Fungsi dan Contohnya</a></li>
    </ul>
  </li>

  <li><a href="#">Simulasi Visual<span class="arrow"></span></a>
    <ul class="submenu level-2">
    <li><a href="#">Pengertian, Fungsi dan Contohnya</a></li>
    </ul>
  </li>

  <li><a href="#">Buku Digital<span class="arrow"></span></a>
    <ul class="submenu level-2">
    <li><a href="#">Pengertian, Fungsi dan Contohnya</a></li>
    </ul>
  </li>

  </ul>
</li>




<li><a href="#">Video Tutorial<span class="arrow"></span></a>
  <ul class="submenu level-1">
  <li><a href="http://simulasidigital-muchamadekisa.blogspot.co.id/2017/05/link-video-tutorial-simulasi-digital.html">Link Video Tutorial Simulasi Digital Kelas 10</a>
  </li>

  <li><a href="#">Microsoft Excel<span class="arrow"></span></a>
    <ul class="submenu level-2">
    <li><a href="http://simulasidigital-muchamadekisa.blogspot.co.id/2017/05/video-tutorial-excel-countifs.html">Excel-Countifs</a></li>
    <li><a href="http://simulasidigital-muchamadekisa.blogspot.co.id/2017/05/video-tutorial-excel-data-validation.html">Excel-Data Validation</a></li>
    <li><a href="http://simulasidigital-muchamadekisa.blogspot.co.id/2017/05/video-tutorial-excel-conditional.html">Excel-Conditional Formating</a></li>
    <li><a href="http://simulasidigital-muchamadekisa.blogspot.co.id/2017/05/artikel-dan-video-tutorial-excel-filter.html">Excel-Filter-Sort</a></li>
    </ul>
    </li>
  </ul>
</li>

<li><a href="#">Informasi<span class="arrow"></span></a>
  <ul class="submenu level-1">
  <li><a href="http://simulasidigital-muchamadekisa.blogspot.co.id/2017/05/about-me.html">About Me</a></li>
  <li><a href="http://smkn1panyingkiran.sch.id">Web Sekolah</a></li>
  <li><a href="http://simulasidigital-muchamadekisa.blogspot.co.id/2017/02/paket-keahlian-di-smk-negeri-1.html">Kompetensi Keahlian</a></li>
  <li><a href="#">Presentasi<span class="arrow"></span></a>
    <ul class="submenu level-2">
    <li><a href="http://simulasidigital-muchamadekisa.blogspot.co.id/2017/05/presentasi-kelas-digital-edmodo.html">Presentasi Kelas Digital Intermediate</a></li>
    <li><a href="http://simulasidigital-muchamadekisa.blogspot.co.id/2017/05/presentasi-dan-tutorial-pembuatan-blog.html">Presentasi dan Tutorial Pembuatan Blog Sebagai Media Pembelajaran</a></li>
    </ul>
    </li>
  </ul>
</li>

<li><a href="#">Evaluasi<span class="arrow"></span></a>
  <ul class="submenu level-1">
  <li><a href="https://docs.google.com/forms/d/e/1FAIpQLScx9NEMTNjqVH_p6Lxl25Evu_qrnLHSYqE4TcxW0pTecQZKMg/viewform">Pengelolaan Informasi</a></li>
  </ul>
</li>


</ul>
</div>

</!doctype>


- - -






Mudah-mudahan dapat bermanfaat.


Sumber :

Saturday, February 10, 2018

Pengertian Presentasi Video

Pengertian Presentasi

  • Presentasi adalah suatu kegiatan berbicara untuk menyampaikan ide atau gagasan di hadapan banyak orang atau hadirin.
  • Presentasi adalah suatu kegiatan berbicara di hadapan banyak hadirin atau salah satu bentuk komunikasi. Presentasi merupakan kegiatan pengajuan suatu topik, pendapat atau informasi kepada orang lain. 

Pengertian Presentasi Video
  • Presentasi video merupakan suatu video untuk mengkomunikasikan gagasan, ide atau rencana, yang bertujuan untuk memperkenalkan produk yang dibuat melalui proses merekam gambar dan suara, menata urutan dan melanjutkan atau memotong gambar dan menyatukannya menjadi kesatuan yang utuh.
  • Presentasi video merupakan suatu presentasi berbentuk video, mengkomunikasikan ide atau gagasan yang dikembangkan melalui proses merekam gambar dan suara (audio), kemudian melakukan editing dengan memodifikasi tampilan, efek, dan merangkaikannya kembali menjadi sebuah karya.






Pengertian Video 
  • Video adalah teknologi untuk menangkap, merekam, memproses, mentransmisikan dan menata ulang gambar bergerak.
  • Biasanya menggunakan film seluloid, sinyal elektronik, atau media digital. Video juga bisa dikatakan sebagai gabungan gambar-gambar yang dibaca berurutan dalam suatu waktu dengan kecepatan tertentu.

x

Wednesday, February 7, 2018

Slide Materi Pembelajaran Pengolah Angka

Slide Materi Pembelajaran Pengolah Angka



Untuk mempelajari materi Pengolah Angka ini dapat melihat dari slide berikut ini :

x