Home » » Cara membuat menu responsif seperti facebook di blog

Cara membuat menu responsif seperti facebook di blog

Dalam posting kali ini taukahbahwa.blogspot.com akan menyajikan artikel tentang Cara membuat menu responsif seperti facebook di blog. Semoga dengan artikel Cara membuat menu responsif seperti facebook di blog akan menambah wawasan untuk anda pembaca setia taukahbahwa.blogspot.com

 
Tanpa diragukan lagi, tekhnologi responsif semakin lama semakin populer. Hal ini memungkinkan kita untuk menghemat waktu ketika kita mengembangkan desain yang dimaksud untuk digunakan pada berbagai perangkat: dari perangkat mobile (hand phone) sampai ke komputer layar lebar. Tidak perlu untuk mengembangkan versi khusus dari situs untuk setiap format (perangkat).  

Pada kesempatan kali ini saya akan share lagi ke anda tentang membuat menu responsif baru yang terlihat seperti menu facebook. Untuk membuat menu ini, kita tidak perlu javascript, semuanya diimplementasikan hanya menggunakan CSS3 (untuk IE7-IE10, Firefox, Opera, Safari, Chrome dan iPad / iPod / iPhone).


KODE HTML
<ul id="nav">
    <li><a href="#">Home</a></li>
    <li class="subs"><a href="#s1">Menu 1</a>
        <ul>
            <li><a href="#">Submenu A</a></li>
            <li><a href="#">Submenu B</a></li>
            <li><a href="#">Submenu C</a></li>
            <li><a href="#">Submenu D</a></li>
        </ul>
    </li>
    <li class="subs"><a href="#s2">Menu 2</a>
        <ul>
            <li><a href="#">Submenu E</a></li>
            <li><a href="#">Submenu F</a></li>
            <li><a href="#">Submenu G</a></li>
            <li><a href="#">Submenu H</a></li>
        </ul>
    </li>
    <li><a href="#">Menu 3</a></li>
    <li><a href="#">Menu 4</a></li>
    <li><a href="http://jalu-pangna.blogspot.com/2013/09/cara-membuat-menu-responsif-seperti.html">Kembali ke tutorial</a></li>
</ul>
LANGKAH-LANGKAHNYA :
  • Masuk ke akun Blogger anda -> Tata Letak ->Tambahkan Gadget -> HTML/Javascript

  • Pastekan kode di atas didalamnya
  • Simpan Gadget...  
Silahkan ganti tanda # dengan URL/Link anda, nama Menu dan Submenu yang anda inginkan

KODE CSS


LANGKAH SELANJUTNYA :
  • Cari tag/kode ]]></b:skin> tekan CTRL+F untuk memudahkan dalam pencarian 
  • Silahkan kopi dan Pastekan kode CSS di atas, tepat diatas tag ]]></b:skin> 
  • Simpan template...Selesai
 HAPPY BLOGGING..!

Dapatkan berita terupdate dan unik setiap saat hanya di taukahbahwa.blogspot.com
Homepage|http://taukahbahwa.blogspot.com

Sobat baru saja membaca artikel yang berkategori Informasi dengan judul Cara membuat menu responsif seperti facebook di blog. Jika sobat rasa artikel ini menarik silakan di share dengan meninggalkan URL http://taukahbahwa.blogspot.com/2014/02/cara-membuat-menu-responsif-seperti.html. Terima kasih atas kunjungannya!

0 komentar:

Posting Komentar