I want to achieve this: A) Desktop image and B) mobile image on mobile, C) both image are fluid and D) the client should load only the ONE image version that is current displayed. Not both images. Media Queries are allowed.

My current solution meets A), B) and C) but not D):
<img name="imageDektop" src="..." class="display-inline
display-none-on-small fit"/>
<!--[if !mso]><!-->
<img name="imageMobile" src="..." class="display-none display-block-on-small fit"/>
<!-- <![endif] -->

In this solution are both images are loaded and one the right image is displayed.

So does someone has an idea?
I know the article "A Slick, New Image Swapping Technique for Responsive Emails". The solution is cool, but solves: A, B and D but not C.

Thank you very much!!!!