我正在使用 css-transitions,它是使用 jquery 添加的幻灯片放映,尽管出于某种原因它没有为元素的背景设置动画。
这是我使用的代码:
$(this).find('.pagers').children().css('-webkit-transition-property', 'background');
$(this).find('.pagers').children().css('-webkit-transition-timing-function', 'linear');
$(this).find('.pagers').children().css('-webkit-transition-duration', du);
$(this).find('.pagers').children().css('-moz-transition-property', 'background');
$(this).find('.pagers').children().css('-moz-transition-timing-function', 'linear');
$(this).find('.pagers').children().css('-moz-transition-duration', du);
$(this).find('.pagers').children().css('-o-transition-property', 'background');
$(this).find('.pagers').children().css('-o-transition-timing-function', 'linear');
$(this).find('.pagers').children().css('-o-transition-duration', du);
$(this).find('.pagers').children().css('-ms-transition-property', 'background');
$(this).find('.pagers').children().css('-ms-transition-timing-function', 'linear');
$(this).find('.pagers').children().css('-ms-transition-duration', du);
$(this).find('.pagers').children().css('transition-property', 'background');
$(this).find('.pagers').children().css('transition-timing-function', 'linear');
$(this).find('.pagers').children().css('transition-duration', du);
我不能只使用常规的 css 转换,因为我正在使用变量。
我已经尝试过使用 .animate 代替,但它没有用。
http://jsfiddle.net/Hive7/uf5gE/
提前致谢
最佳答案
像这样做某事:
$('.pager').css({
'-webkit-transition' : 'background-color '+du+'s linear'
});
当然你必须为所有浏览器添加代码
关于javascript - 使用变量时背景没有动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18280251/