From your screencast video, your gallery settings look OK (although there should be no need to explicitly set imageScaleMode="SCALE_DOWN" as this is the default value for this option)
Without actually being able to see your gallery live on your web server, my best guess as to the cause of the problem is that some CSS code (perhaps from your theme) may be affecting your gallery. For example, if there is some global CSS somewhere on your page which is being applied to all images on the page, then it will affect the images in the gallery, too. You might need to track down this CSS and ensure that it is applied to only these elements on your web page that actually require it.

To see if this is the case, try temporarily reverting to a default WordPress theme (such as Twenty Sixteen) to see if this solves the problem.
If it does, then you could go back to your current theme and check, using your browser's developer tools (usually accessible via the F12 key), to see what CSS is being applied to the images in the gallery.

It is not possible to isolate a Juicebox gallery (or any other HTML element) from global CSS and the gallery has no option but to inherit such rules.
The best course of action would be to have CSS rules applied to only those elements on your web page which require them through use of further CSS selectors (classes and ids).

I hope this points you in the right direction.

If you continue to experience difficulties, then please post the URL to your gallery's web page so that I can take a look at the problem for myself and hopefully help further. Thank you.