Cara Menciptakan Hidangan Floating Fixed
Tuesday, August 12, 2014
Add Comment
Cara Membuat Menu Floating Fixed - Floating Menu (Menu Melayang) atau sering juga disebut dengan "Fixed Menu" yang pada dasarnya ialah sajian yang selalu berada di atas, walaupun blog di scroll hingga bawah.
Cara menciptakan floating sajian / fixed sajian ini sudah direquest oleh beberapa sahabat, namun gres ketika ini aku buat tutorialnya. Untuk lebih jelasnya,sahabat sanggup lihat sajian paling atas di blog ini, atau lihat screenshoot dibawah ini :
Cara menciptakan :
1. Masukkan instruksi ini di atas ]]></b:skin> :
2. Ganti 970px dengan ukuran blog sobat. Untuk mendeklarasikannya, simpan instruksi ini di bawah </head>
Itulah sob Cara Membuat Menu Floating Fixed di blog. Semoga tips ini sanggup mempercantik tampilan blog sobat.
Source
Cara menciptakan floating sajian / fixed sajian ini sudah direquest oleh beberapa sahabat, namun gres ketika ini aku buat tutorialnya. Untuk lebih jelasnya,sahabat sanggup lihat sajian paling atas di blog ini, atau lihat screenshoot dibawah ini :
Cara menciptakan :
1. Masukkan instruksi ini di atas ]]></b:skin> :
/* Floating Menu */ #ki_floating_menu{background-color: #1484CE;background: #1484ce;background: -moz-linear-gradient(top, #1484ce 0%, #1274b5 100%);background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1484ce), color-stop(100%,#1274b5));background: -webkit-linear-gradient(top, #1484ce 0%,#1274b5 100%);background: -o-linear-gradient(top, #1484ce 0%,#1274b5 100%);background: -ms-linear-gradient(top, #1484ce 0%,#1274b5 100%);background: linear-gradient(to bottom, #1484ce 0%,#1274b5 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1484ce', endColorstr='#1274b5',GradientType=0 );border-bottom: 1px solid rgba(255, 255, 255, 0.1);box-shadow: 0 2px 0 #0E5A8C;box-shadow: 0px 2px 0px #0e5a8c;height:34px;width:100%;min-width:970px;position:fixed;top:0;left:0;z-index:9999;overflow:hidden;border-bottom:1px solid #2a8fd2;} #ki_floating_menu ul{list-style: none;margin:0 auto;width:970px;} #ki_floating_menu ul li{float:left} #ki_floating_menu ul li a{line-height:34px;padding:0 15px;color:#f0e8e5;font-size:13px;font-family:Arial, sans-serif;text-shadow:0px -1px 0px #0f669f;display:block;text-decoration:none;border-right: 1px solid #1470ad;border-left:1px solid #2a88c6;} #ki_floating_menu ul li a:hover{background-color:rgba(255,255,255,0.125);color:white;}
2. Ganti 970px dengan ukuran blog sobat. Untuk mendeklarasikannya, simpan instruksi ini di bawah </head>
<!-- Floating Menu--> <div id='ki_floating_menu'> <ul> <li style='border-left:1px solid rgba(30, 30, 30, 0.125);'><a href='/'><img alt='Home' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlFT-bjNqMbttvdFdYyWJuU3IiKSWTsPUDb4yGGl0fXduxGdncOvVIHldruBzYPspJeWLPDa9bLTS3iOKSTVlxBBAzvvqw16Mh69Us8VU9mJ2fzlfE4s8dZkb7ke34fvbEFaNPVt0_QkE/s1600/home.png' style='padding:0px;'/></a></li> <li><a href='#'>Menu 1</a></li> <li><a href='#'>Menu 2</a></li> <li><a href='#'>Menu 3</a></li> <li><a href='#'>Menu 4</a></li> <li><a href='#'>Menu 5</a></li> </ul> </div>
Related
Itulah sob Cara Membuat Menu Floating Fixed di blog. Semoga tips ini sanggup mempercantik tampilan blog sobat.
Source
0 Response to "Cara Menciptakan Hidangan Floating Fixed"
Post a Comment
Blog ini merupakan Blog Dofollow, karena beberapa alasan tertentu, sobat bisa mencari backlink di blog ini dengan syarat :
1. Tidak mengandung SARA
2. Komentar SPAM dan JUNK akan dihapus
3. Tidak diperbolehkan menyertakan link aktif
4. Berkomentar dengan format (Name/URL)
NB: Jika ingin menuliskan kode pada komentar harap gunakan Tool untuk mengkonversi kode tersebut agar kode bisa muncul dan jelas atau gunakan tool dibawah "Konversi Kode di Sini!".
Klik subscribe by email agar Anda segera tahu balasan komentar Anda