$(document).ready(function() {
    $(document).ready(function() {
        var MenuItems = $("#topmenu > li").size() + 1;
        var tmheight = 45; // topmenu default height

        // operate menu bar
        var timer;
        $("#topmenu > li:lt(" + MenuItems + ")").mouseenter(1000, function() {

            $licontainer = $(this);

            if (!$licontainer.hasClass('nav-active')) {
                $('.nav-active').removeClass('nav-active');
                $licontainer.addClass('nav-active');
            }

            if (!$licontainer.hasClass('menuactive'))
                $('.navdetail').fadeOut();

            $detail = $(this).children('div');
            if ($(this).children('div').length > 0) {
                if (!$licontainer.hasClass('menuactive')) {
                    timer = setTimeout(function() {

                        $('#navcontainer').css('height', $detail.height() + 78 + 'px');
                        $('#navplaceholder').css('height', $detail.height() + 13 + 'px');

                        $("#navplaceholder").slideDown('fast', function() {
                            $('#topmenu').css('height', tmheight + $detail.height() + 'px');
                            $detail.fadeIn();                                                     
                        });
                    }, 400);
                }
            }
            else {
                clearTimeout(timer);
                $('.navdetail').hide(function() {
                    $("#navplaceholder").slideUp();
                    $('#topmenu').css('height', tmheight + 'px');
                    $('#navcontainer').css('height', '60px');
                });
            }

        });

        // hide menu details
        $('.collnav').mouseenter(function() {

            //$("#navplaceholder").slideUp();

            clearTimeout(timer);
            $('.nav-active').removeClass('nav-active');
            $('.navdetail').hide(function() {
                $("#navplaceholder").slideUp();
                $('#topmenu').css('height', tmheight + 'px');
                $('#navcontainer').css('height', '60px');
            });






        });

        //        $('.menuhotspot').live('mouseleave', function() {
        //            alert('hello');
        //        });

    });
});