Переделка скрипта меню на JQuery

[Bangoo]

Нашел интересное выпадающее меню на JQuery. Демо. Прикрутил его на свой шаблон. Переделал под себя дизайн, но проблема в том что фон выпадающего меню сплошной, я же хочу сделать прозрачный, с закругленными краями и рамкой.

Для этого мне нужно сделать три контейнера DIV, предварительно запихнув их в главный контейнер.

В div-top положить шапку рамки, в div-content повторяющуюся среднюю, и нижнюю в div-bottom.

Но сложность в том, что исходный скрипт распространяется только на один div ".sub", как туда вместить верхний и нижний контейнеры понятия не имею, потому что совсем не ориентируюсь ни в JQuery ни в Jave. Помогите если возможно, ну очень не хочется отказываться от красивой менюшки.

Код скрипта

//On Hover Over
function megaHoverOver(){
$(this).find(".sub").stop().fadeTo('fast', 1).show(); //Find sub and fade it in

(function($) {
//Function to calculate total width of all ul's
jQuery.fn.calcSubWidth = function() {
rowWidth = 0;
//Calculate row
$(this).find("ul").each(function() { //for each ul...

rowWidth = $(this).width(); //Add each ul's width together
});
};
})(jQuery);  

if ( $(this).find(".row").length > 0 ) { //If row exists...

var biggestRow = 0;  

$(this).find(".row").each(function() { //for each row...
$(this).calcSubWidth(); //Call function to calculate width of all ul's

//Find biggest row
if(rowWidth > biggestRow) {
biggestRow = rowWidth;
}
});

$(this).find(".sub").css({'width' :biggestRow}); //Set width

$(this).find(".row:last").css({'margin':'0'}); //Kill last row's margin

} else { //If row does not exist...

$(this).calcSubWidth(); //Call function to calculate width of all ul's
$(this).find(".sub").css({'width' : rowWidth}); //Set Width

}
}
//On Hover Out
function megaHoverOut(){
$(this).find(".sub").stop().fadeTo('fast', 0, function() { //Fade to 0 opactiy

$(this).hide(); //after fading, hide it
});
}
//Set custom configurations
var config = {
sensitivity: 2, // значение = чувствительность (должно быть больше 1)
interval: 100, // значение = интервал задержки при открытии
over: megaHoverOver, // функция возврата (обязательно)

timeout: 500, // значение = интервал задержки при открытии при закрытии
out: megaHoverOut // function = функция возврата (обязательно)
};

$("ul#topnav li .sub").css({'opacity':'0'}); //Fade sub nav to 0 opacity on  
default
$("ul#topnav li").hoverIntent(config); //Trigger Hover intent with custom configuration

[WalkMan]

так а что мешает выпадающий блок так записать?

			<div class="sub">
				<div class="top"></div>
				<div class="center">
					<ul>
						<li><h2><a href="#">Desktop</a></h2></li>
						<li><a href="#">Navigation Link</a></li>
					</ul>
				</div>
				<div class="bottom"></div>
			</div>

[psywalker]

так а что мешает выпадающий блок так записать?

Знания

[Bangoo]

Спасибо, помогло, все оказалось гораздо проще.