0

我有一个脚本，当单击按钮时，该按钮会旋转，不透明度会发生变化，并且段落会滑动。我知道旋转不会发生，因为它使用了 webkit 功能，但我仍然希望改变不透明度和打开段落，这些应该在 IE 8 中发生，但由于某种原因不会。提前感谢您的帮助。

var effects_of_yoga_2010_INFO = {
    "-webkit-transition": "webkit-transform 0.25s ease-in-out"
};
$("#effects_of_yoga_2010_INFO").css(effects_of_yoga_2010_INFO);


var effects_of_yoga_2010_DEG = 0;

$("#effects_of_yoga_2010_INFO").toggle(function() {
$("p#effects_of_yoga_2010_TEXT").slideDown("250");
effects_of_yoga_2010_DEG += 45;
effects_of_yoga_2010_INFO.style.setProperty('-webkit-transform', 'rotateZ(' +   
effects_of_yoga_2010_DEG + 'deg)');
$("#effects_of_yoga_2010_INFO").fadeTo("250", 0.65);
}, function() {
$("p#effects_of_yoga_2010_TEXT").slideUp("250");
effects_of_yoga_2010_DEG += 45;
effects_of_yoga_2010_INFO.style.setProperty('-webkit-transform', 'rotateZ(' +  
effects_of_yoga_2010_DEG + 'deg)');
$("#effects_of_yoga_2010_INFO").fadeTo("250", 0.3);
});
4

2 回答 2

1

现在您已经提供了一个 jsFiddle，当我运行您的代码时，我看到它在 IE8 中抛出异常，因为该style.setProperty()方法不存在。因此，切换功能的其余部分不会运行。如果我暂时将这些setProperty()行注释掉，则.fadeTo()可以在 IE8 中使用。

那么，为什么不使用 jquery 的.css()方法而不是.setProperty()设置那些样式参数，然后您不必担心浏览器的兼容性。

例如：

$("#effects_of_yoga_2010_INFO").css("-webkit-transition", "-webkit-transform 0.25s ease-in-out");

使用.fadeTo()而不是，.animate()jQuery 将为旧版本的 IE 中的不透明度设置使用正确的过滤器值。有关更多信息，请参阅fadeTo() 上的 jQuery 文档。

这是一个在 IE8 中使用.toggle()and的示例：http: //jsfiddle.net/jfriend00/29JUB/.fadeTo()

于 2012-10-03T15:10:48.320 回答
0

您在切换功能中使用切换功能，这将无法正常工作。尝试slideUp，slideDown而不是。

正如 jfriend00 所说，您可以使用fadeTo属性轻松更改不透明度！

于 2012-10-03T15:13:09.847 回答