Go to anchor AFTER loading

You can solve the problem using a JQuery script, this can postpone the anchor link after the page is loaded, i added an offset of 20 px also.

$(document).ready(function() {
    if(window.location.hash) {
        $('html, body').animate({
            scrollTop: $(window.location.hash).offset().top - 20
        }, 500);
    }
});

...it keeps loading images, which changes the position of the content

It's a best practice to explicitly declare your image sizes to avoid unnecessary repaints:

https://developers.google.com/speed/docs/best-practices/rendering#SpecifyImageDimensions

Specify image dimensions

Overview

Specifying a width and height for all images allows for faster rendering by eliminating the need for unnecessary reflows and repaints.

Details

When the browser lays out the page, it needs to be able to flow around replaceable elements such as images. It can begin to render a page even before images are downloaded, provided that it knows the dimensions to wrap non-replaceable elements around. If no dimensions are specified in the containing document, or if the dimensions specified don't match those of the actual images, the browser will require a reflow and repaint once the images are downloaded. To prevent reflows, specify the width and height of all images, either in the HTML tag, or in CSS.

Recommendations

Specify dimensions that match those of the images themselves. Don't use width and height specifications to scale images on the fly. If an image file is actually 60 x 60 pixels, don't set the dimensions to 30 x 30 in the HTML or CSS. If the image needs to be smaller, scale it in an image editor and set its dimensions to match (see Optimize images for details.) Be sure to specify dimensions on the image element or block-level parent Be sure to set the dimensions on the element itself, or a block-level parent. If the parent is not block-level, the dimensions will be ignored. Do not set dimensions on an ancestor that is not an immediate parent.

So use:

<img src="cat.jpg" alt="A Cat" width="360" height="200">

Or

<img src="cat.jpg" alt="A Cat" style="width:360px;height:200px;">

...or you can specify the dimensions in an external stylesheet, but generally that is more difficult with varying image sizes. This will ensure your content doesn't shift as images are loaded.