图像之间的淡入淡出作为语义中的背景图像-UI
Crossfading between images as background-image in Semantic-UI
我想要的是在两个图像之间交叉淡入淡出(在 jsfiddle 中为了简化示例我使用了颜色)。图片必须是 div.
的背景
正如您在 fiddle 中看到的那样,行为很奇怪 - 毕竟 div 回到了它之前的 css 属性。
我使用语义-ui.
jQuery代码:
$('#button').click(function () {
$('#maindiv').transition('fade').css('background-color','red').transition('fade');
});
fade()
函数似乎更像是一个问题。在第一次调用 fade()
.
之后,它似乎没有保留对 #maindiv 元素所做的任何更改
您可以使用 CSS 转换来完成您想做的事情(请注意浏览器对 CSS 转换的支持。如果您需要更多浏览器支持,jQuery animate() 可能对你更有用)。
Fiddle: http://jsfiddle.net/7vm6rhs3/
我想要的是在两个图像之间交叉淡入淡出(在 jsfiddle 中为了简化示例我使用了颜色)。图片必须是 div.
的背景正如您在 fiddle 中看到的那样,行为很奇怪 - 毕竟 div 回到了它之前的 css 属性。
我使用语义-ui.
jQuery代码:
$('#button').click(function () {
$('#maindiv').transition('fade').css('background-color','red').transition('fade');
});
fade()
函数似乎更像是一个问题。在第一次调用 fade()
.
您可以使用 CSS 转换来完成您想做的事情(请注意浏览器对 CSS 转换的支持。如果您需要更多浏览器支持,jQuery animate() 可能对你更有用)。
Fiddle: http://jsfiddle.net/7vm6rhs3/