通过CSS媒体查询和@keyframes关键帧动画来解决。

示例代码如下：

HTML代码：

CSS代码：

.image-wrapper {
  width: 100%;
  overflow: hidden;
}

/* 在不同屏幕尺寸下设置不同的图片尺寸 */
@media screen and (min-width: 768px) {
  .image-wrapper img {
    width: 50%;
    float: right;
  }
}

@media screen and (max-width: 767px) {
  .image-wrapper img {
    width: 100%;
    float: none;
  }
}

/* 添加关键帧动画，应用移动效果 */
@keyframes moveRight {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0); 
  }
}

/* 在不同屏幕尺寸下应用动画 */
@media screen and (min-width: 768px) {
  .image-wrapper img {
    animation: moveRight 5s ease-in-out infinite alternate-reverse;
  }
}

@media screen and (max-width: 767px) {
  .image-wrapper img {
    animation: none;
  }
}

在上面的代码示例中，我们使用CSS媒体查询来针对不同屏幕尺寸设置不同的图片尺寸，并随后添加了一个关键帧动画，以应用移动效果并让图片元素在不同屏幕尺寸下移动。至于实际动画的实现方式取决于您的具体需求，这里我们只是提供了一个简单的示例以供参考。最后，请注意，在使用关键帧动画时，请始终使用适当的浏览器前缀来确保跨浏览器兼容性。