﻿function ejv(iconIndex) {

    //Find the description of the icon
    var details = $("#icons div").parent("#icons").next("#details").find("ul li:eq(" + iconIndex + ")");
    details.css("display", "none");
    details.removeAttr("timer");
}

$(document).ready(function() {

    var zIndex = 999;

    $("#icons div").hover(
        function() {

            //Get the child index of the icon
            var iconIndex = $(this).prevAll().size();

            //Get the position of the icon
            var iconPos = $(this).position();

            //Get the dimensions of the icon
            var iconWidth = $(this).width();
            var iconHeight = $(this).height();

            //Find the description of the icon
            var details = $(this).parent("#icons").next("#details").find("ul li:eq(" + iconIndex + ")");
            if (details.attr("timer") != null) {
                clearTimeout(details.attr("timer"));
            }

            //Add the css to the description of the icon
            details.css("display", "block");
            details.css("z-index", zIndex++);
            details.css("position", "absolute");
            
            details.css("left", iconPos.left + iconWidth);


		//de pop-ups in limburg vallen buiten de website
		//de pop-ups worden 60px omhoog gezet
		//details.css("top", iconPos.top + iconHeight -60);

		if(iconPos.top>460)
		{
			details.css("top", iconPos.top + iconHeight -60);
		}
		else
		{
			details.css("top", iconPos.top + iconHeight);
		}

        },
        function() {
            var iconIndex = $(this).prevAll().size()

            //Remove the visibility of the description
            var x = setTimeout("ejv(" + iconIndex + ");", 1000);
            var details = $(this).parent("#icons").next("#details").find("ul li:eq(" + iconIndex + ")");
            details.attr({ timer: x });
        }
    );
});
