The images are being cropped.

For example, '4.jpg' is a bit tall.

Make images more 'landscape', see attached.

You should optimise your images. Your clock is 328KB, my modified version is only 90KB.

I've just viewed in the preview of ipad and iphones and the whole image shows in the iphone 6 and 5s yet on the other versions and the ipad it's the cropped version.

Thanks Steevb I understand now but how can I know what pixels ratio would suit on every layout

I've tried both 900x500 and 600x400 and still it crops it, is there a way to turn the crop off.

I'm having the same issue with 5.7. As a test I photoshopped some graphics and added an inch transparent boarder around them to force it to center in the slider pane. It worked but this can't be the right way.
I'm not a coder, but it seems that the slider block needs to force the picture into it's boundaries and not the other way around. It seems the larger the scale of picture causes the slider box to grow to accommodate it.

What is strange though it works perfectly when viewed on devices like your phone but websites no go. I ran an inspection through Chromes development tools and increased the height pixels which then it displayed correctly but I was unable to locate this code anywhere. I started another thread as this one seemed to be going no where and the suggestion came to look into my theme folder and other files I cannot remember but have them written down anyway those files recommended I couldn't find them either.