Not Slide Down

[Deadweight]

Currently I am trying to make a unique slider that will slide down a div item with the id bce_slider once you mouse over an li. Also, if you move your mouse over to bce_slider it will not disappear. However if you mouseleave/mouseout the #nav>li or #bce_slider then #bce_slider should slide away.
Here is my the issue with the code:

$(document.body).on('mouseout',':not('+a.id+' *, #bce_slider)',function(e){
		$('#'+a.sliderId).html('')
		$('#'+a.sliderId).stop().animate({
				height:'0px'
			},300)
			
	})

Here is the URL:
http://thebcelements.com/dhtml/slider/slide.htm

Anyways, thanks in advance!

[Deadweight]

I actually fixed this on my own
My solution:

$(function(){
	menuSlider({
		id: '#nav',
		slideLocation: '#mainBody',
		sliderId: 'bce_slider'
	})

})
var h
function menuSlider(a){
	var ihtml = $(a.slideLocation).html()
	$(a.slideLocation).html('<div id="'+a.sliderId+'"></div><div class="newBody">'+ihtml+'</div>')
	var loc = -1
	var i = -1;
	
	$('#nav *, #bce_slider, #bce_slider *').mouseenter(function(){
		if($(this).parent().attr('id')=='nav'){
			i = $(this).index()
		}
		
		var h = $(a.id+'Zone>li').eq(i).html()
		var hh = getHeight(h)
		var hhh = $('#'+a.sliderId).height()
		$('#'+a.sliderId).html(h)
		$('#'+a.sliderId).stop().animate({
				height:hh+'px'
			},300)
		dev(h)
	}).mouseleave(function() {
        $('#'+a.sliderId).html('')
		$('#'+a.sliderId).stop().animate({
				height:'0px'
			},300)
    })
}