Cara membuat menu dropdown dengan bootstrap
|
Menu Dropdown adalah menu yang berisi submenu dan submenu akan muncul jika tombol menu ditekan. Dan jika menu tersebut dibuat pada web responsif maka tampilan menu akan menyesuaikan dengan ukuran layar device yang digunakan untuk membuka halaman web. Dengan membuat menu pada web responsif memungkinkan pengunjung web yang membuka halaman web menggunakan smartphone akan mendapat tampilan desain web yang baik dan rapih, sehingga memudahkan pengunjung menjelajahi halaman sebuah web responsif. Show
Lalu bagaimana cara membuat menu Dropdown pada web responsif menggunakan Bootstrap? Kamu tinggal memanggil class untuk menu Dropdown yang disediakan oleh Bootstrap. Berikut adalah uraian bagaimana cara membuat menu Dropdown pada web responsif menggunakan Bootstrap :
Jika kamu buka pada halaman web akan menjadi seperti berikut: Lalu ketika kamu tekan tombol menu tersebut maka submenu akan tampil seperti berikut: Perhatikan penjelasan berikut :
Point-point di atas adalah catatan yang harus kamu implementasikan pada menu dropdown menggunakan Bootstrap. Dengan dasar tersebut kamu sudah bisa membuat menu Dropdown pada web responsif menggunakan Bootstrap. Tapi masih ada beberapa jenis menu Dropdown menggunakan class yang disediakan Bootstrap bisa dipakai untuk membuat berbagai variasi menu yang mungkin kamu butuhkan. Berikut adalah beberapa jenis menu Dropdown menggunakan class yang disediakan Bootstrap. 1. Dropdown DividerClass .divider digunakan untuk memisahkan tautan di dalam menu dropdown dengan batas horizontal tipis:Berikut adalah uraiannya:
Perhatikan pada tag <li class="divider"></li>. Di sini class divider digunakan untuk membuat menu Dropdown Divider. 2. Dropdown HeaderClass .dropdown-header digunakan untuk menambahkan header di dalam menu dropdown:Berikut adalah uraiannya:
Perhatikan pada tag <li class="dropdown-header">Dropdown header 1</li>. Di sini class dropdown-header digunakan untuk membuat menu Dropdown header . 3. Disable dan Active itemsClass .active (menambahkan warna latar belakang biru).Untuk menonaktifkan item di menu dropdown, gunakan class .disabled (warna teks menjadi abu-abu terang dan ikon "no-parking-sign" di hover atau saat panah kursor menunjuknya): Berikut adalah uraiannya:
Perhatikan pada tag <li class="disabled"><a href="#">CSS</a></li> <li class="active"><a href="#">HTML</a></li> Di sini class disabled dan class active digunakan untuk membuat menu Disable dan Active items . 4. Dropdown PositionUntuk posisi di kanan dropdown, tambahkan class .dropdown-menu-right ke elemen dan .dropdown-menu:Berikut adalah uraiannya:
Perhatikan pada tag <ul class="dropdown-menu dropdown-menu-right">. Di sini clas .dropdown-menu-right dan .dropdown-menu digunakan untuk membuat menu Dropdown Position. 5. DropupJika kamu ingin menu dropdown meluas ke atas, bukan ke bawah, ubah elemen dengan class = "dropdown" menjadi "dropup":
Share LabelsPemrograman WebsiteLabels: Pemrograman Website Share Pemrograman Java : Cara Membuat Matriks Pada JavaDecember 20, 2017 Pengertian umum dari matriks adalah type data yang mengacu sekumpulan elemen bertipe sama melalui 2 indeks (baris & kolom). Atau ada juga yang mengartikan matriks sebagai array dua dimensi. Jika array satu dimensi hanya terdiri satu baris dan beberapa kolom sedangkan matriks memiliki baris dan kolom lebih dari satu. Jika ingin mendapat dasar pembahasan dan contoh algoritma matriks bisa dilihat pada artikel Pembahasan Dan Contoh Algoritma Matriks . Dalam artikel tersebut dijelaskan konsep dasar dari algoritma matriks tanpa berkaitan dengan bahasa pemrograman apapun. Kembali ke pembahasan kita kali ini, yaitu membuat Cara Membuat Matriks Pada Java. Berikut adalah code seluruh program dari pembuatan matriks pada java. import java.util.Scanner; public class Array { public static void main(String[] args) { int jumlahBaris, jumlahKolom; Scanner scanner = new Scanner(System.in); System.out.print("Masukan Jumlah indeks baris martriks : & Share Read more Pembahasan Dan Contoh Algoritma ArrayNovember 30, 2017 Array adalah type data yang mengacu sekumpulan elemen bertipe sama melalui indeks. Memiliki sifat tersusun secara terurut dan memiliki indeks. Contoh : A : array[1..10] of char TNamaHari : array[1..7] of string TJumHari : array[1..12] of integer Contoh Pemakaian Array Program NamaHari Kamus TNamaHari : array[1..7] of string HariKe : integer Algoritma TNamaHari[1]←”Senin” TNamaHari[2]←”Selasa” TNamaHari[3]←”Rabu” TNamaHari[4]←”Kamis” TNamaHari[5]←”Jumat” TNamaHari[6]←”Sabtu” TNamaHari[7]←”Minggu” input (HariKe) output(TNamaHari[HariKe]) Contoh di atas adalah contoh array dengan jumlah indeks 7, dan setiap indeks diisi dengan nama-nama hari. Mengisi array bisa dilakukan dengan membuat sistem/algoritma pengulangan sampai jumlah indeks array yang dibutuhkan atau tersedia. Lalu disetiap pengulangan dimasukan nilai data pada indeks array. Skema Pemrosesan Array Skema pemrosesan array : Inisialisasi i traversal [1..NMax] Share Read more Pemrograman Java : Cara getText dan setText Pada Java GUINovember 26, 2016 Pada Java GUI untuk mendapatkan text yang user input kamu harus mengambil text dari text area atau bisa juga text field. Untuk melakukannya bisa menggunakan fungsi getText() yang ada pada Java. getText() adalah fungsi yang ada pada Java untuk mengambil teks yang diinput pada form. Lalu untuk memunculkan sebuah teks pada text area atau text field dapat menggunakan fungsi setText(). Akan diberikan contoh form sebagai berikut untuk lebih memahami penggunaan setText() dan getText() pada Java. Berikut adalah Cara getText dan setText Pada Java GUI : Buatlah form pada JFrame seperti gambar diatas. Caranya hanya tinggal klik kanan pada package yang diinginkan new-->JFrame Form... Lalu buat form seperti berikut: Berikan nama variabel pada text field sesuai kegunaan. Contohnya text field jurusan akan diberi nama variabel "jurusan". Caranya klik kanan pada text field yang dikehendaki lalu pilih Change variable name. Ini untuk memudahkan menggunakan va HTML apa yang benar untuk membuat daftar drop down?Perhatikan pada file menu.html di atas, untuk membuat menu dropdown, element HTML yang kita gunakan adalah element
Apa itu fitur drop down?Dilansir dari Kiat Excel, Drop Down List merupakan fitur Excel yang berfungsi untuk mempermudah input data. Umumnya berisi beberapa pilihan data dan pengguna hanya boleh memilih salah satu dari list tersebut. Salah satu dalam menerapkan drop down biasanya terjadi ketika ingin memuat data serupa pada sheet yang berbeda.
Apa itu Drop Down di HTML?Dropdown Menu adalah Menu yang mempunyai submenu di dalamnya jadi jika kita arahkan kursor ke menu tersebut maka akan muncul menu lainya yang memanjang ke bawah dan di dalamnya terdapat submenu.
|
