CODE TẠO MENU CỰC ĐẸP - LƯU LÀM MẪU CHO KHÁCH

BƯỚC 1: CHÈN CODE SAU DƯỚI DÒNG  ]]></b:skin>

<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){

$(&quot;ul.subnav&quot;).parent().append(&quot;<span/>&quot;); //Only shows drop down trigger when js is enabled - Adds empty span tag after ul.subnav

$(&quot;ul.topnav li span&quot;).click(function() { //When trigger is clicked...

//Following events are applied to the subnav itself (moving subnav up and down)
$(this).parent().find(&quot;ul.subnav&quot;).slideDown(&#39;fast&#39;).show(); //Drop down the subnav on click

$(this).parent().hover(function() {
}, function(){
$(this).parent().find(&quot;ul.subnav&quot;).slideUp(&#39;slow&#39;); //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(&quot;subhover&quot;); //On hover over, add class &quot;subhover&quot;
}, function(){ //On Hover Out
$(this).removeClass(&quot;subhover&quot;); //On hover out, remove class &quot;subhover&quot;
});

});
</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(http://1.bp.blogspot.com/_4HKUHirY_2U/SuvG9uqdygI/AAAAAAAAAGg/RGkds76x-Ks/topnav_bg.gif) 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(http://2.bp.blogspot.com/_4HKUHirY_2U/SuvHEn2GZ9I/AAAAAAAAAGo/s4ncczdnOd0/topnav_hover.gif) no-repeat center top;
}
ul.topnav li span { /*--Drop down trigger styles--*/
width: 17px;
height: 35px;
float: left;
background: url(http://2.bp.blogspot.com/_4HKUHirY_2U/SuvHKqBeOXI/AAAAAAAAAGw/qGYlY4ckLWc/subnav_btn.gif) 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(http://3.bp.blogspot.com/_4HKUHirY_2U/SuvHPYoc82I/AAAAAAAAAG4/3DDzBwklYpw/dropdown_linkbg.gif) no-repeat 10px center;
padding-left: 20px;
}
html ul.topnav li ul.subnav li a:hover { /*--Hover effect for subnav links--*/
background: #222 url(http://3.bp.blogspot.com/_4HKUHirY_2U/SuvHPYoc82I/AAAAAAAAAG4/3DDzBwklYpw/dropdown_linkbg.gif) 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(http://3.bp.blogspot.com/-B7odrNSlmMk/Tf87jqUeERI/AAAAAAAADVk/blxjplvLUmw/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(http://2.bp.blogspot.com/-pqZOgO9qRdo/Tf87LTRzZNI/AAAAAAAADVc/-kwLop-vRU4/s1600/top-li-hv.png) repeat-x top left;
}

ul#topnav li.mg-home {
background:url(http://3.bp.blogspot.com/-dhqJETIW3kE/Tf87VnxK_2I/AAAAAAAADVg/XmgtQTdh0zM/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>





 

MỌI THÔNG TIN VUI LÒNG LIÊN HỆ :   
  
TRUNG TÂM THIẾT KẾ WEBSITE - VCUPDESIGN
Phụ trách thiết kế : Mr.Mika Nguyễn
Call me : 0919.08.3000 - 0927.927.000 - Email :  pro_mikanguyen@yahoo.com.vn 
Phụ trách kỹ thuật và kinh doanh : Mr.Nguyễn Sơn
Call me : 093.363.21.21 -   Email :   Setup247@Gmail.Com - Lienhe365@gmail.com
Hỗ trợ yahoo 24/24 : pro_mikanguyen
Website : www.vcupdesign.com

GIỚI THIỆU ĐẾN QUÝ KHÁCH MỘT SỐ DỰ ÁN SẼ THỰC HIỆN TRONG NĂM 2018


DANH MỤC BÀI ĐĂNG - KHÁCH MUỐN XEM NỘI DUNG GÌ LICK VÀO TIÊU ĐỀ ẤY


WEBSITEMIKA - THƯƠNG HIỆU UY TÍN BỞI HƠN 300 DOANH NGHIỆP VÀ CÁC THƯƠNG HIỆU VỪA VÀ NHỎ LỰA CHỌN
Điểm giao dịch: Online 24h
-Email: Setup247@gmail.com - Website: https://thietkeweb.mikalaza.com