jQuery 动画不透明度在 Safari 中不起作用

Posted 2023-03-06

【中文标题】jQuery 动画不透明度在 Safari 中不起作用

【英文标题】：jQuery animate opacity doesn't work within Safari

【发布时间】：2012-11-04 00:15:59

【问题描述】：

jQuery animate opacity 不想和 Safari 搭配得很好；出于某种原因，当我直接在 CSS 中设置不透明度时，没关系；但是当我尝试使用 jQuery animate 时它不起作用。有什么想法/已知问题吗？

我正在直接编辑 SVG 标签，可以在其他浏览器上使用，但似乎是 safari 的问题

【参考方案1】：

在动画之前在 jQuery 中设置不透明度。

$("#offerd_desc li").css('opacity', '0');

【参考方案2】：

这对我有用：Fiddle HERE

$('div').hover(function()
$(this).animate(opacity:0.5,1000);
);​

【参考方案3】：

从此

$("#offerd_desc li").css('opacity', '0');

将不透明度 INSTANT 设置为 0，您将使用动画（）；

$("#offerd_desc li").mouseover(
    $(this).stop().animate(opacity:0.5,500);
);

$("#offerd_desc li").mouseout(
    $(this).stop().animate(opacity:0.5,500);
);

在你做动画之前使用 stop() ，否则当你快速悬停它会导致闪烁。 我强烈建议使用 200 - 500 毫秒等速度，否则动画会花费很长时间。