滑入并滑出图像

Question

我试图获得一个平滑的效果,当一个图像滑出时,另一个图像滑入.这个动画需要的方式是,当一个东西滑出另一个滑动时,它们都占据了内部空间div同时.

像这样或者这样的东西

我创建了一个简单的jsFiddle,描述了他面临的问题.

    $("#googleLogo").hide("slide", {
        direction: "right"
    }, 500 );
    $("#yahooLogo").show("slide", {
        direction: "left"
    }, 500 );

在我开始滑动另一个之前,我基本上就把一件事搞砸了.我想我在某个地方犯了一个愚蠢的错误.

Answer 1

这取决于您的标记和样式结构:

CSS:

#imageSliding {
   position:relative;
   height:100px;
}
#imageSliding img {
   position:absolute;
   left:0;
   top:0;
}
#yahooLogo {
  display:none;
}

CHECKOUT FIDDLE,可能你想要这样的东西.