jQuery Draggable x,y containment relative to absolutely positioned container

I have a map that I am trying to make draggable, and am containing with x,y coordinates. The problem I'm having is that these coordinates seem to be based on window size.

It works perfectly in a 1280x1024 window, but any other window size throws the containment off. I'm hesitant to use a parent container, because the image is so large (1350x1700).

My code looks like this

CSS:

    #mapcontainer {
    width:700px;
    height:500px;
    overflow:hidden;
    padding:0px;
    margin:-250px -350px;
    border:4开发者_开发百科px solid #ddd;
    position:absolute;
    top:50%;
    left:50%;
    z-index:2;
}
#map {
    position:relative;
    top:-400px;
    left:-200px;
    z-index:1;
}

#mapimg {
    position:relative;
    top:0px;
    left:0px;
}

HTML

<div id="mapcontainer">
    <div id="map">
        <img src="map.jpg" alt="" id="mapimg" onload="reveal();" />
    </div>
</div>

JS

$(function() {
    $( "#map" ).draggable({containment: [-340,-1035,275,120]});
});