Kuliah Online

Posts

Showing posts with the label JQuery

Membuat Sticky Menu dengan HTML CSS dan JQuery

August 28, 2016

Membuat sticky menu dengan html,css dan jquery. Pada tutorial kali ini saya ingin membagikan sebuah tutorial yaitu cara membuat sticky menu dengan menggunakan Html,Css dan Jquery. Apa sih sticky menu ?? oke saya akan menjelaskan apa itu sticky menu ialah sebuah animasi pada navigasi yang digunakan agar navigasi berada paling atas saat scrollbar di scroll ke bawah. Ok langsung saja teman-teman perhatikan kode dibawah ini : 1. Langkah pertama silahkan teman-teman buat terlebih dahulu sintak htmlnya seperti berikut : <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Membuat Sticky Menu dengan Jquery dan CSS</title> <link rel="stylesheet" href="Assets/css/style.css"> </head> <body> <header> <h1>Sticky Menu</h1> </header> <nav> <div class="container"> <div class="brand"><img src="Assets/img/logo3.png...

Belajar Membuat Scroll Top HTML CSS dan JQuery

July 19, 2016

Belajar Membuat Scroll Top HTML CSS dan JQuery ~ Membuat Scroll Top untuk sebuah website atau blog sangat berfungsi untuk membantu pengunjung Website kita bisa mudah kembali ke atas halaman tanpa, menggulirkan scroll page. Nah dalam pembuatan ScrollTop ini kita hanya membutuhkan code HTML,CSS dan JQuery sebagai pembuatan animasi pada Scroll Top . Ok langsung saja kita ke tahap pembuatannya. 1. Langkah Pertama yang harus teman-teman buat ialah tag htmlnya, bisa kalian lihat seperti dibawah : <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>background-images</title> <link rel="stylesheet" href="font-awesome/css/font-awesome.css"> <link rel="stylesheet" href="css/style.css"> </head> <body> <header> <h2>Scroll Top</h2> </header> <div class="content"> <h1>Content</h1> </div> <f...

Membuat Navigasi Dropdown Dengan Efek Keren dan Responsive

July 10, 2016

Cara membuat Navigasi Dropdown dengan Efek Keren dan Responsive~ Pada tutorial kali ini saya ingin membagikan tutorial yaitu masih dalam materi HTML & CSS, dan sedikit sentuhan Jquery untuk membuat responsivenya. Pada tutorial sebelumnya saya sudah membuat tutorial yaitu Cara membuat Navigasi Flat yang keren. Untuk teman-teman yang belum membaca artikel tutorial saya sebelumnya silahkan kunjungi link dibawah ini : Baca Juga : Cara membuat Navigasi Flat yang keren. Nah, yang sekarang saya hanya menambahkan sebuah menu dropdown untuk menambah kesan elegan pada menu navigasi tersebut. Ok langsung saja kita buat codingnya : 1. teman siapkan terlebih dahulu index.html. scriptnya bisa teman lihat dibawah ini <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Membuat Navigasi Flat Keren + Responnsive</title> <!-- script css berikut untuk menghubungkan script html dengan font-awesome.css di dalam folder font...