<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
$("ul.subnav").parent().append("<span/>"); //Only shows drop down trigger when js is enabled - Adds empty span tag after ul.subnav
$("ul.topnav li span").click(function() { //When trigger is clicked...
//Following events are applied to the subnav itself (moving subnav up and down)
$(this).parent().find("ul.subnav").slideDown('fast').show(); //Drop down the subnav on click
$(this).parent().hover(function() {
}, function(){
$(this).parent().find("ul.subnav").slideUp('slow'); //When the mouse hovers out of the subnav, move it back up
});
//Following events are applied to the trigger (Hover events for the trigger)
}).hover(function() {
$(this).addClass("subhover"); //On hover over, add class "subhover"
}, function(){ //On Hover Out
$(this).removeClass("subhover"); //On hover out, remove class "subhover"
});
});
</script>
<style type='text/css'>
ul.topnav {
list-style: none;
padding: 0 0px;
margin: 0;
float: left;
width: 100%;
background: #222;
font-size: 1.2em;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEV-XUzV09ffv3jckJPk7QnnYE4deoRYarObri2VYT6mKeiLXLuKGHV8iMWYFYb2Jpi_sfEo1lMaj2VCv_662WItJqwrTXb65U6Xb4FQU7A-UGv4SQTHVYoTxvkLi9u5w9XB59CimggTle/) repeat-x;
}
ul.topnav li {
float: left;
margin: 0;
padding: 0 15px 0 0;
position: relative; /*--Declare X and Y axis base--*/
}
ul.topnav li a{
padding: 10px 5px;
color: #fff;
display: block;
text-decoration: none;
float: left;
}
ul.topnav li a:hover{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLJm3cZgVU_2-ry1FvqAz6-KOy0JhjcaL4WomaK_EYzEaKb2CFEzP9QsqJZ6OrmZnrDFVLKxSBTim0LBSV7F89ln8nt1gixKNfriqsMJhBteCg-_RC_xzJCWhLfyyOap4cooBX6DfSVp2H/) no-repeat center top;
}
ul.topnav li span { /*--Drop down trigger styles--*/
width: 17px;
height: 35px;
float: left;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUzxC6l3tgtduPEDfwwt523CLtQx7IzUU9DvrrsAXkoHMOcI1b66rIBgwwPDK0lA418_RtoexIIuwTcbX-NrAlwPIfPE4TwHUmqz_W_kjC4AWEpGisu_ZlRWb8bh-7q2v3JTJ41cyH3ET-/) no-repeat center top;
}
ul.topnav li span.subhover {background-position: center bottom; cursor: pointer;} /*--Hover effect for trigger--*/
ul.topnav li ul.subnav {
list-style: none;
position: absolute; /*--Important - Keeps subnav from affecting main navigation flow--*/
left: 0; top: 35px;
background: #333;
margin: 0; padding: 0;
display: none;
float: left;
width: 170px;
-moz-border-radius-bottomleft: 5px;
-moz-border-radius-bottomright: 5px;
-webkit-border-bottom-left-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
border: 1px solid #111;
}
ul.topnav li ul.subnav li{
margin: 0; padding: 0;
border-top: 1px solid #252525; /*--Create bevel effect--*/
border-bottom: 1px solid #444; /*--Create bevel effect--*/
clear: both;
width: 170px;
}
html ul.topnav li ul.subnav li a {
float: left;
width: 145px;
background: #333 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUTJP-lFQjnrtXS39T76PgAYDgJNeUL_9RTv9fwi3C0ktwe7KxwEJFKfYp6bkGXHPlJTz4WEIW1xgCJjbeTB0VJjOiw0cF45FKdFvvVytyBtjggJ1rSkjrtFokTAxwVXUWLtK3ntFbgI1f/) no-repeat 10px center;
padding-left: 20px;
}
html ul.topnav li ul.subnav li a:hover { /*--Hover effect for subnav links--*/
background: #222 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUTJP-lFQjnrtXS39T76PgAYDgJNeUL_9RTv9fwi3C0ktwe7KxwEJFKfYp6bkGXHPlJTz4WEIW1xgCJjbeTB0VJjOiw0cF45FKdFvvVytyBtjggJ1rSkjrtFokTAxwVXUWLtK3ntFbgI1f/) no-repeat 10px center;
}
#header img {
margin: 0px 0 0px;
}
</style>
<style type='text/css'>
#fdmega-menu ul {list-style: none;}
ul#topnav {
float: left;
width: 97.5%;
position: relative;
height: 39px;
background: #0082ff;
}
ul#topnav li {
float: left;
height: 39px;
padding: 0px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHNap-wZqnUevIfDKGqTaxDHKJsyzot8wKxLH3WTghItgkSyFUXACYsREv9hUiomUQgqKyFPUx0igDKjzoob1RgtmDrjOLkBdLODmV6BWA2Q76Q4MVRO5m-cuEy_cAfV8TEH5Ag2uGbV4b/s1600/right-li-nobg.png) no-repeat top right;
}
ul#topnav li a {
padding: 10px 15px;
display: block;
color: #f0f0f0;
text-decoration: none;
}
ul#topnav li:hover {
background: #ff7d00 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhq-Hsyjs0nETHUPcEIgCefJTiedkzAOcjPg6G2lZjBUmxPuxF2uFHwiR5FSt0I5UzrsVbmE9HhvizPmK3IZPPzB5-gBHJybo6b-DQIWEzVvxEn5M4IJq4qWsvtLhglh7FlQvd2hM3Ul4Iw/s1600/top-li-hv.png) repeat-x top left;
}
ul#topnav li.mg-home {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjU45ooAuVGg7D_X-Iid2hZ5Uor2VN2f-Gy6dA-o0bjcff8Fbc8l7oljogUdxHxaObUwbAtDeMW51sdITmyCGg0sfqVo2FJE79HKqeb8zHBxEo8aKN5qSFTYzXl6e4dCS_Iq54m6qOyjsxP/s1600/home-ico-bg.png) no-repeat top right!important;
width:45px;
}
ul#topnav li.mg-home a {height:19px;}
ul#topnav li div.sub {
position: absolute;
top: 39px;
background: #ff7d00;
padding:5px;
display: none;
border-right:4px solid #0082ff;
border-left:4px solid #0082ff;
border-bottom:4px solid #0082ff;
color:#fff;
}
ul#topnav li:hover div.sub {display: block;}
ul#topnav li div.sub p {margin-bottom:5px;text-align:justify;}
ul#topnav li div.sub div.cont {float: left;padding:5px;}
ul#topnav li div.sub div.cont h3 {}
ul#topnav li div.sub div.cont a{display:block; margin:0;padding:0;padding:0 0 5px;color:#ddd;}
ul#topnav li div.sub div.cont a:hover{color:#fff;}
ul#topnav li div.ms1 {}
ul#topnav li div.ms2 {width:97.5%;left: 8px;}
ul#topnav li div.ms3 {width:97.5%;left: 5px;}
ul#topnav li div.ms4 {}
ul#topnav li div.ms5 {width:97.5%;right: 10px;background:#ff7d00 url( #) no-repeat bottom right;}
ul#topnav li div.sub div.cs21 {width:150px;}
ul#topnav li div.sub div.cs31 {width:180px;}
</style>
BƯỚC 2: CHÈN VÀO VỊ TRÍ MONG MUỐN
<div class='toppic'>
<div class='topnav'>
<div class='widget-content'>
<ul class='topnav'>
<li><a href='http://5giaymuaban.blogspot.com/'>Trang chủ</a></li>
<li>
<a href='#'>Giới thiệu</a>
<ul class='subnav'>
<li><a href='#'>Về chúng tôi</a></li>
<li><a href='#'>Về thông tin</a></li>
<li><a href='http://5giaymuaban.blogspot.com/'>Về sự hình thành</a></li>
</ul>
</li>
<li>
<a href='#'>Dịch vụ</a>
<ul class='subnav'>
<li><a href='http://5giaymuaban.blogspot.com/'>Cung cấp địa chỉ</a></li>
<li><a href='http://5giaymuaban.blogspot.com/'>Danh bạ khách sạn</a></li>
<li><a href='http://5giaymuaban.blogspot.com/'>Danh bạ khu nghỉ mát</a></li>
</ul>
</li>
<li>
<a href='#'>Tuyến điểm</a>
<ul class='subnav'>
<li><a href='http://5giaymuaban.blogspot.com/'>Khu vực miền Bắc</a></li>
<li><a href='http://5giaymuaban.blogspot.com/'>Khu vực miền Trung</a></li>
<li><a href='http://5giaymuaban.blogspot.com/'>Khu vực miền Nam</a></li>
</ul>
</li>
<li>
<a href='#'>Nghe nhạc</a>
<ul class='subnav'>
<li><a href='http://www6.nhac.vui.vn/'>Nhạc vui</a></li>
<li><a href='http://nhacso.net/music/'>Nhạc số</a></li>
<li><a href='http://www.nhaccuatui.com/'>Nhạccuatui</a></li>
<li><a href='http://mp3.zing.vn/'>ZingMp3</a></li>
<li><a href='http://www.findmidis.com/'>Nhạc Midi</a></li>
<li><a href='http://www.nghenhac.info/'>Nhạc tổng hợp</a></li>
</ul>
</li>
<li>
<a href='#'>Gởi thiệp</a>
<ul class='subnav'>
<li><a href='http://www.muctim.com.vn/ecard/'>Chúc mừng 3</a></li>
<li><a href='http://www.123greetings.com/'>Chúc mừng 4</a></li>
<li><a href='http://thiepdep.24h.com.vn/'>Chúc mừng 5</a></li>
<li><a href='http://www.evite.americangreetings.com/'>Chúc mừng 6</a></li>
<li><a href='http://beta2.clip.vn/greeting_video'>Chúc mừng 7</a></li>
<li><a href='http://www.thiepviet.com/ecard/'>Chúc mừng 8</a></li>
</ul>
</li>
<li>
<a href='#'>Tiện ích</a>
<ul class='subnav'>
<li><a href='http://www.mirrorcreator.com'>Upload files</a></li>
<li><a href='http://www.convertfiles.com'>Chuyển đổi files</a></li>
<li><a href='http://ipiccy.com/'>Chỉnh sửa ảnh trực tuyến</a></li>
<li><a href='http://workbank.vn/home.aspx'>Việc làm</a></li>
<li><a href='http://moj.gov.vn/pages/home.aspx'>Văn bản pháp luật</a></li>
<li><a href='http://quickscan.bitdefender.com'>Diệt virus trực tuyến</a></li>
</ul>
</li>
<li>
<a href='#'>Download</a>
<ul class='subnav'>
<li><a href='http://refont.com/'>Free Font</a></li>
<li><a href='http://icones.pro/'>Free icons</a></li>
<li><a href='http://www.newfreescreensavers.com/download-free-screensavers.html'>SreenSaver</a></li>
<li><a href='http://download.cnet.com/windows/'>Các phần mềm thông dụng</a></li>
<li><a href='http://sound-effects-library.com/'>Thư viện âm thanh</a></li>
<li><a href='http://www.junglewalk.com/sound/animal-sounds.htm'>Âm thanh động vật</a></li>
</ul>
</li>
<li>
<a href='#'>Karaoke</a>
<ul class='subnav'>
<li><a href='http://star.zing.vn/'>Star Zing.vn</a></li>
<li><a href='http://sannhac.com/home'>Sannhac.com</a></li>
<li><a href='http://singkar.com/'>SingKar.com</a></li>
</ul>
</li>
</ul>
</div>
</div>
</div>
Hỗ trợ yahoo 24/24 : pro_mikanguyen















