﻿$(document).ready(
    function() 
    {  
        //move   
        $("#ctl00_ContentPlaceHolder1_ErstAuswahl").bind("mousemove", 
            function(event)
            {
                var offset = $("#Karte").offset(); 
                
                var x = event.pageX - offset.left;
                var y = event.pageY - offset.top;
                
                moveRect(x, y);                
            }
        );
        
        //Overout
        $("#ctl00_ContentPlaceHolder1_ErstAuswahl").bind("mouseover", 
            function(event)
            {
                $("#over").fadeIn("fast");
                $("#over div").css( 'filter', 'Alpha(opacity=20)');          
            }
        ); 
        
        $("#ctl00_ContentPlaceHolder1_ErstAuswahl").bind("mouseout", 
            function(event)
            {
                $("#over").fadeOut("fast");              
            }
        ); 
        
        //Click
        $("#ctl00_ContentPlaceHolder1_ErstAuswahl").bind("click", 
            function(event)
            {
                $("#ctl00_ContentPlaceHolder1_ErstAuswahl").unbind("mousemove");
                $("#ctl00_ContentPlaceHolder1_ErstAuswahl").unbind("mouseout");             
            }
        ); 
    }
);
      
function calculateX(mouseX)
{
    var mainWidth = $("#ctl00_ContentPlaceHolder1_ErstAuswahl").width();
    mouseX = mouseX - 89;
        
    if(mouseX < 0)
    {
        mouseX = 0;
    }
        
    if(mouseX > (mainWidth - 178))
    {
        mouseX = (mainWidth - 178);
    }
        
    return mouseX;
}  
    
function calculateY(mouseY)
{
    var mainHeight = $("#ctl00_ContentPlaceHolder1_ErstAuswahl").height();
    mouseY = mouseY - 66;
        
    if(mouseY < 0)
    {
        mouseY = 0;
    }
        
    if(mouseY > (mainHeight - 132))
    {
        mouseY = mainHeight - 132;
    }
        
    return mouseY;
}  
    
function moveRect(mouseX, mouseY)
{ 
    var x = calculateX(mouseX);
    var y = calculateY(mouseY); 
        
    $("#over").css("top",y + "px");
    $("#over").css("left",x + "px");    
}  
                         
