Vertical menu ini mampu menghadirkan deskripsi menu dengan mempunyai lebar dan tinggi ruang deskripsi yang dapat di atur. Memungkinkan kamu untuk menyampaikan beberapa hal yang diharapkan membuat pengunjung blog penasaran sehingga tergelitik untuk mengetahui isi menu tersebut.
Letakkan KODE CSS di bawah ini di bagian head di atas ]]></b:skin>, kemudian CHTML di letakkan di bagian body atau kamu bisa menggunakan :Edit HTML --> Elemen Laman -->
Tambah Gadget --> Javascript/HTML
Letakkan Kode Css/script diantara <hsad> dan </hsad>
Kode CSS
ul#bgsGRverdescript {
margin : 5px;
list-style-type : none;
font-size : 90%;
}
ul#bgsGRverdescript li {
margin-bottom : 5px;
}
ul#bgsGRverdescript a {
opacity:0.7;
-moz-opacity:0.7;
filter:alpha(opacity=70);
position : relative;
text-align:center;
width : 145px;
height : 40px;
display : block;
padding : 5px;
padding-right : 0;
border : 2px solid #669900;
background : #ddd url(http://i50.tinypic.com/25g42gg.gif) repeat-x;
color: #FFFF66;
text-decoration : none;
font-weight : bold;
cursor : pointer;
}
ul#bgsGRverdescript a span {
z-index:1; border:8px solid #3399FF;
position : absolute;
top : -9000px;
left : -9000px;
display : block;
width : 300%;
height :100px;
background : #fafafa url(http://snook.ca/technical/jquery-bg/bg3.jpg);
border: 4px solid #663300;
border-left : 0;
padding : 5px;
padding-left : 23px;
text-indent : -17px;
cursor : pointer;
color: #000;
}
ul#bgsGRverdescript a:hover, ul#bgsGRverdescript a:focus,
ul#bgsGRverdescript a:active {
background : url(http://i49.tinypic.com/1079ef7.gif);
color: #CC0000;
opacity:1.0;
-moz-opacity:1.0;
filter:alpha(opacity=100);
}
ul#bgsGRverdescript a:hover span, ul#bgsGRverdescript a:focus span,
ul#bgsGRverdescript a:active span {
top : -1px; opacity:0.9;-moz-opacity:0.9;filter:alpha(opacity=90);
left :70px;
}
letakan Kode Berikut di antara tag <body> dan </body>
Contoh Htlm Untuk Menu
Tanda # pada CHTML adalah URL Link Menu.
Pulau Bali, Papua dan Kalimantan merupakan nama Menu
Background, warna, jenis font dan ukuran tinggi serta lebar bisa kamu sesuaikan sendiri
Letakkan KODE CSS di bawah ini di bagian head di atas ]]></b:skin>, kemudian CHTML di letakkan di bagian body atau kamu bisa menggunakan :Edit HTML --> Elemen Laman -->
Tambah Gadget --> Javascript/HTML
Letakkan Kode Css/script diantara <hsad> dan </hsad>
Kode CSS
ul#bgsGRverdescript {
margin : 5px;
list-style-type : none;
font-size : 90%;
}
ul#bgsGRverdescript li {
margin-bottom : 5px;
}
ul#bgsGRverdescript a {
opacity:0.7;
-moz-opacity:0.7;
filter:alpha(opacity=70);
position : relative;
text-align:center;
width : 145px;
height : 40px;
display : block;
padding : 5px;
padding-right : 0;
border : 2px solid #669900;
background : #ddd url(http://i50.tinypic.com/25g42gg.gif) repeat-x;
color: #FFFF66;
text-decoration : none;
font-weight : bold;
cursor : pointer;
}
ul#bgsGRverdescript a span {
z-index:1; border:8px solid #3399FF;
position : absolute;
top : -9000px;
left : -9000px;
display : block;
width : 300%;
height :100px;
background : #fafafa url(http://snook.ca/technical/jquery-bg/bg3.jpg);
border: 4px solid #663300;
border-left : 0;
padding : 5px;
padding-left : 23px;
text-indent : -17px;
cursor : pointer;
color: #000;
}
ul#bgsGRverdescript a:hover, ul#bgsGRverdescript a:focus,
ul#bgsGRverdescript a:active {
background : url(http://i49.tinypic.com/1079ef7.gif);
color: #CC0000;
opacity:1.0;
-moz-opacity:1.0;
filter:alpha(opacity=100);
}
ul#bgsGRverdescript a:hover span, ul#bgsGRverdescript a:focus span,
ul#bgsGRverdescript a:active span {
top : -1px; opacity:0.9;-moz-opacity:0.9;filter:alpha(opacity=90);
left :70px;
}
letakan Kode Berikut di antara tag <body> dan </body>
Contoh Htlm Untuk Menu
<ul id="bgsGRverdescript">
<li><a href="#"><strong>Pulau<br /> Bali</strong>
<span>→ Sebuah pulau kecil yang sangat Indah. Tempat wisata budaya terbaik di Indonesia. Masyarakat Bali berbeda dengan pada umumnya masyarakat di Indonesia .....</span></a></li>
<li><a href="#"><strong>Pulau <br />Papua</strong>
<span>→ Sebuah daerah yang kaya raya dengan sumber kekayaan alam tiada batas tetapi sangat kontradiktif dengan kondisi sosial masyarakatnya .....</span></a></li>
<li><a href="#"><strong>Pulau<br /> Kalimantan</strong>
<span>→ Dari ribuan pulau yang menjadi bagian Negara Republik Indonesia, inilah pulau terbesar yang hingga saat ini ......</span></a></li>
</ul>
Catatan:
Tidak ada komentar:
Posting Komentar