css - position image so left half is visible and right half is behind div

Question

I have an image that I want to "peek" from behind a div: the left half of the image peeks from behind a div, and the rest is hidden - like this.

The div has the following css:

#div{
    float: left;
    position: relative;
    margin-left: 5%; }

For the peeker I have tried using:

#peeker {
    position: fixed;
    margin-left: 2.5%;
}

However, this only works when zoom is at 100%. When I zoom out, #peeker is no longer 50% shown.

Is it possible to do this without using javascript?