我怎样才能做到这一点？ - 动画报价 - JQuery

Posted 2023-02-24

【中文标题】我怎样才能做到这一点？ - 动画报价 - JQuery

【英文标题】：How can I do this? - Animate Quote's - JQuery

【发布时间】：2012-02-16 03:44:10

【问题描述】：

请看这张图片：

我需要这样的东西，它会显示报价逐渐相互叠加。我不想使用 flash，我想让客户端更新尽可能容易。有人有什么建议吗？

【参考方案1】：

我建议使用 jquery animate，http://api.jquery.com/animate/ 或只是淡入淡出，http://api.jquery.com/fadeIn/

根据需要旋转引号，使用z-index 将它们放在彼此之上（不要忘记添加position: relative 或position: absolute），然后隐藏它们。

Css3 旋转示例：

-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

如果您需要使其适用于不支持 css3 的浏览器，您可以在 PS 中旋转透明的 .png:s。

关于一个一个地淡化引号我会做这样的事情：

$(".quotecontainer img").each(function(index) 
    $(this).delay(400*index).fadeIn(300);
);