为什么我的图像会从 jQuery UI 弹跳效果中移动？

Question

我只是希望 bounce 效果出现在主页上 #bounce1,2,3... 图像的

mouseover

上，但它似乎迫使图像移至下一行。

什么给予？

Answer 1

无需 JavaScript 和 jQuery，仅使用 CSS3 即可实现相同的效果。使用

@keyframes

定义关键帧，然后在

animation

属性中使用它。 这是与您的示例相关的 JSFiddle 演示。
有关 CSS3 的

animation

属性的更多信息，请检查 此 URL。

Answer 2

您需要将其添加到您的样式表中。

#fp_brands a .ui-effects-wrapper { 
float: left !important; 
width: 33% !important;
}

jquery-ui 在其动画中使用的 ui-effect-wrapper div 有时会弄乱浮动元素。这是因为它的CSS规则包括width: 100%;和浮动：无；

Answer 3

使用元素检查器，对每个图像应用

float:left;

使它们根据需要设置动画。如果您不在其他地方使用它来保存代码，我会将其应用于类

attachment-medium

Answer 4

尝试添加此 css 并从

width="33%"

 标签中删除 

img

？

.attachment-medium {
    position:relative;
    width:235px;
    height:100px;
}