miniProject 1 modul 5: list changing color and hover

JavaScript miniproject 1 modul 5 by Araechpaet.R.Gading

Haii haiiii! Saya Araechpaet, murid kelas X-RPL dari SMKN 1 Jakarta, dan saya senang dapat berbagi pengalaman tugas DPK dan mini project lanjutan dari project sebelumnya dan merupakan modul yang baru. Setelah sukses mengeksplorasi proyek dari modul sebelumnya, kali ini kita akan merambah ke dunia yang tak kalah menarik, dengan modul yang baru.


miniProject 1 modul 5:


code:

HTML: di bagian html ada 3 bagian besar yang pertama list item yang menggunakan ul li, lalu div yang berguna untuk memuat input dengan tipe radio untuk warna text nya

CSS: digunakan untuk membuat warna pada saat nanti difungsikan dan kebanyakan menggunakan class bawaan dan id

javaScript: di javascript menggunakan function yang ketika ada perubahan di nilai maka akan terjadi perubahan sesuai yang diharapkan user. 


Result:

tampilan awal saat membuka web

ketika radio yang bagian atas diklik maka warna text akan berubah

jika radio yang bagian bawah diklik, dan cursor(hover) diarahkan ke tulisan, maka akan merubah warna baground yang diarahkan oleh user.

penutup: 
kita sudah menyelesaikan miniproject 1 modul 5, sekaligus merupakan awalan dari modul 5, ke depannya mungkin kita bisa membuat miniproject dari modul yang lebih menarik lagi, jika ada kekurangan di blog saya mohon maaf sebesar besarnyak terimakasih sudah berkunjung!





Komentar

Posting Komentar

Postingan populer dari blog ini

mini project 1 modul 4 js : pengenalan javascript & convertTemperature

Gambar
Memahami Dasar-Dasar JavaScript: Pengantar untuk Pemula: Halo semuanya!, saya Araechpaet kelas X-RPL dari SMKN 1 Jakarta melakukan tugas DPK dan mini project. Pada kesempatan kali ini, kita akan membahas dasar-dasar JavaScript, bahasa pemrograman yang sangat penting dalam pengembangan web. Jika Anda seorang pemula yang baru memasuki dunia pemrograman, artikel ini akan memberikan pengantar singkat namun informatif tentang JavaScript. Apa itu JavaScript? JavaScript adalah bahasa pemrograman yang digunakan untuk membuat situs web interaktif. Dikembangkan oleh Netscape pada tahun 1995, JavaScript menjadi bahasa yang esensial dalam pengembangan web modern. Meskipun namanya mirip dengan Java, keduanya sebenarnya adalah bahasa yang berbeda. Kelebihan JavaScript Interaktivitas: JavaScript memungkinkan Anda membuat elemen-elemen interaktif pada halaman web. Misalnya, tombol yang dapat diklik, formulir yang dapat diisi, dan banyak lagi. Kompatibilitas: Sebagian besar browser web mendukung JavaSc...
Baca selengkapnya

css by ara

Gambar
  Pengertian CSS     Cascading Style Sheet yang biasa di singkat css, adalah bahasa program untuk menghias dan menggambarkan tampilan yang ada di HTML dan XML.  Dengan CSS, Anda dapat mengontrol bagaimana elemen-elemen HTML ditampilkan di browser web, seperti warna, jenis font, tata letak, ukuran, dan banyak aspek tampilan lainnya. Internal, external, dan inline pada css      untuk menggunakan css agar dapat menghias html, ada 3 cara untuk menggabungkan atau menyelipkan pada html, yaitu internal, external, dan inline a. Internal css     internal css adalah metode untuk memasukkan css langsung di dalam html nya b.external css     external css adalah metode untuk menggunakan css dengan cara mengetik kode css di file yang dipisah c.inline css     inline css adalah metode untuk menggunakan css langsung di dalam baris tertentu di html tugas css. Araechpaet.R.Gading X-RPL Jumat, 6 Oktober 2023
Baca selengkapnya

MiniProject 2 modul 4 : styleEventItems

Gambar
JavaScript miniproject 2 modul 4 by Araechpaet.R.Gading Halo semuanya! Saya Araechpaet, murid kelas X-RPL dari SMKN 1 Jakarta, dan saya senang dapat berbagi pengalaman tugas DPK dan mini project kedua saya. Setelah sukses mengeksplorasi proyek sebelumnya, kali ini kita akan merambah ke dunia yang tak kalah menarik, yaitu dasar-dasar JavaScript dan project mendatang. MiniProject 2 modul 4: code: Jika pada miniproject sebelumnya, saya menggunakan internal javascript (js), pada project kali ini saya menggunakan eksternal js, atau saya membuat file baru  dan dihubungkan dengan script src (lihat baris 29). selain itu saya juga menambahkan style css untuk membuat bilangan genap menjadi tebal dan biru, yang nanti akan bisa kita atur melalui js ini bagian js nya, dengan menggunakan perulangan foreach, seperti code diatas, yang habis dibagi 2, atau bilangan genap, akan menambahkan class blue-bold, yang mana class blue-bold adalah css yang belum ditambahkan. jika anda tidak ingin berbeda fil...
Baca selengkapnya