Change image on mouse positon final

by lovromar

HTML

<div id="image_holder">
<div id="image_rotate" class="tryme" style="">  </div>
</div>

CSS

#image_holder{
    left:100px;
    margin: auto 0;
    position: absolute;
    width: 400px;
}



#image_rotate {
    background: url("http://z6creation.net/img/site/faces/pascale_mixed.jpg") 0px 0px;
    height: 481px;
    width: 691px;
}

JavaScript

var image_src = {
	
    
    middle: "background-position: 730px 0px;",
	left: "background-position: 730px 480px;",
	topleft: "background-position: 730px 960px",
	top: "background-position:730px 1440px;",
	topright: "background-position:730px 1920px;",
	right: "background-position: 730px 2400px",
    bottomright: "background-position: 730px 2880px;", 
	bottom: "background-position:730px 3360px;",
	bottomleft: "background-position: 730px 3840px;"
    
   
	
};

var Hsection = $(document).width() / 3;
var Vsection = $(document).height() / 3;

console.log(Hsection);
console.log(Vsection);

$(document).mousemove(function(event){
    var mloc = {
        x: event.pageX,
        y: event.pageY
    };
    
    // TOP ROW
    if( 
        (mloc.x < Hsection) &&
        (mloc.y < Vsection)
    ){
        $(".tryme").attr("style", image_src.topleft);
    }else if( 
        (mloc.x > Hsection && mloc.x < Hsection * 2) &&
        (mloc.y < Vsection)
    ){
        $(".tryme").attr("style", image_src.top);
    }else if( 
        (mloc.x > Hsection * 2 && mloc.x < Hsection * 3) &&
        (mloc.y < Vsection)
    ){
        $(".tryme").attr("style", image_src.topright);
    }
    
    // MIDDLE ROW
    else if( 
        (mloc.x < Hsection) &&
        (mloc.y > Vsection && mloc.y < Vsection * 2)
    ){
        $(".tryme").attr("style", image_src.left);
    }else if( 
        (mloc.x > Hsection && mloc.x < Hsection * 2) &&
        (mloc.y > Vsection && mloc.y < Vsection * 2)
    ){
        $(".tryme").attr("style", image_src.middle);
    }else if( 
        (mloc.x > Hsection * 2 && mloc.x < Hsection * 3) &&
        (mloc.y > Vsection && mloc.y < Vsection * 2)
    ){
        $(".tryme").attr("style", image_src.right);
    }
    
    // BOTTOM ROW
    else if( 
        (mloc.x < Hsection) &&
        (mloc.y > Vsection * 2 && mloc.y < Vsection * 3)
    ){
        $(".tryme").attr("style", image_src.bottomleft);
    }else if( 
        (mloc.x > Hsection && mloc.x < Hsection * 2) &&
 ...