<script>

//<![CDATA[ 

jQuery(function(){

$("ul.top-nav li a").mouseenter(function() { 

var subnavmenu = $(this).parent().find("li.subnav");

subnavmenu.slideDown('fast').show();

$(this).parent().hover(function() {

$(this).addClass('sel');

}, function(){

$(this).removeClass('sel');

subnavmenu.slideUp('fast'); 

});

}).hover(function() { 

$(this).addClass("subhover"); 

}, function(){

$(this).removeClass("subhover");

});

});

//]]>

</script>

<style>

nav {background:url('images/menu/bg-menu.png') no-repeat; width:1000px; height:27px; line-height:25px; margin:5px 0px;}

.top-nav { margin:0; padding:0 42px; list-style:none;}

.top-nav > li { float:left; padding:0 3px; margin:0 5px; position:relative;}

.top-nav > li > a { text-decoration:none; color:#0053A3; font-size:12px; background:url('images/menu/bg-menu-active.png') no-repeat right 50px; 

padding-right:10px; display:block;font-weight:bold; text-shadow:1px 1px 2px #fff, -1px -1px 2px #fff;}

.top-nav > li > a span { background:url('images/menu/bg-menu-active.png') no-repeat left 50px; margin-left:-7px; padding-left:10px; display:block;}

.top-nav > li > a:hover, .top-nav > li.sel > a { color:#fff; font-weight:bold; background-position:right center; text-shadow:none;}

.top-nav > li > a:hover span, .top-nav > li.sel > a span { background-position:left center;}

.subnav { margin:0; padding:0; list-style:none; display:none; position:absolute; top:25px; left:0; z-index:8888; box-shadow: 1px 2px 2px #666; -moz-box-shadow: 1px 2px 2px #666; -webkit-box-shadow: 1px 2px 2px #666;}

.subnav li {display:block; border-top:1px solid #3589c8; border-bottom:1px solid #2474ad; clear:both; width:220px;}

.subnav li a {background-color:#06F; display:block; color:#fff; text-decoration:none; padding:2px 0 2px 12px;}

.subnav li a:hover {background-color:#206496; font-weight:bold;}

</style>

<nav>

<ul class='top-nav'>

<?

$sql_main=mysql_query("select * from cfb_menu");

while($row_main=mysql_fetch_array($sql_main)){

echo"<li><a href=''><span>$row_main[nav_name]<span></a></li>";

//วนลูป sub

$sql_sub=mysql_query("select * from cfb_menu_sub where nav_id=$row_main[nav_id]");

while($row_sub=mysql_fetch_array($sql_sub)){

echo"<ul class='subnav'><li><a href=''><span>$row_sub[sub_name]</span></a></li></ul>";

}

}

?>

</ul>

</nav>