Tutorial Web Design Cara Membuat Menu Responsive Dengan HTML, CSS dan Javascript - Pembuatan menu responsive kali ini admin akan buat dengan sederhana yaitu dengan membuat satu tempat logo disebelah kiri dan 5 menu di sebelah kanan.

Kemudian kelima menu tsb akan berubah menjadi simbol hijau bulat yang jika di klik akan muncul kelima menu di bawahnya. responsive yang admin gunakan yaitu pada ukuran 800px. Jadi ketika ukuran website tidak lebih dari 800 maka tampilan ke lima menu akan disematkan.

Berikut ini merupakan contoh hasil akhirnya :

inponow - Cara Membuat Menu Responsive Dengan HTML dan CSS

Kemudian berikut ini merupakan script code html dan script js nya :



Saya akan jelaskan sedikit mengenai kode js yang dicantumkan di atas. script pertama untuk meload melakukan load jquery.min.js. Lalu script kedua $(".togel.tblmenu").click(function ()  menjalankan kondisi jika class togel dan tblmenu atau ketika simbol bulat hijau itu di klik maka di class menu akan menambahkan class sh . Berikut merupakan script CSS :



Baca Juga : Macam-Macam CSS dan Cara Menggunakan CSS (Cascading Style Sheet)

Ok itu merupakan script yang digunakan untuk Membuat Menu Responsive Dengan HTML, CSS JS. Kalian jangan lupa untuk mendownload library jquery.min,js di https://jquery.com. Kemudian letakan di folder js. Ok itu saja yang dapat saya sampaikan hari ini kurang lebihnya saya mohon maaf. Semoga bermanfaat dan terimakasih.