Internet Explorer 7、8：jQuery UI特效仅能运行一次

Question

背景

我使用jQuery UI效果（slide和drop）来打开和关闭幻灯片。

以下代码在Chrome、Firefox和IE 9上运行良好。

在IE 7和8上，我只能打开和关闭一次幻灯片。之后，幻灯片就会保持隐藏状态。

有什么想法可以解决这个问题吗？

• jQuery：1.8.0/1.8.1
• jQuery UI：1.8.23

代码 + JSFiddle

// Opens a slide
$('a[data-toggle="slide"]').click(function (e) {
    e.preventDefault(); 

    currentSlide = $(this).attr('href');

    $(currentSlide).show('slide', { direction: 'right' }, _config.effectDuration);
    $('div.modal-backdrop').fadeIn(_config.effectDuration);
});

// Closes the current slide
$('div.modal-backdrop, button.close').click(function () {
    $(currentSlide).hide('drop', { direction: 'right' }, _config.effectDuration);
    $('div.modal-backdrop').fadeOut(_config.effectDuration);
});

- GG.

---

jQuery的新版本已经停止支持IE 7。 - Ibu

你能在 JSFiddle 上重新创建这个吗？ - Shmiddty

@Ibu：我们的客户使用IE 7浏览器。我使用jQuery 1.8.0和jQuery UI 1.8.23，它们兼容吗？ - GG.

根据他们的博客，他们没有放弃对IE 7/8甚至6的支持。http://blog.jquery.com/2012/08/09/jquery-1-8-released/ - Henrik Ammer

@Shmiddty - 我添加了 jsfiddle。 - GG.

Answer 1

在IE8中（从IE9兼容模式开始），滑块的内联样式如下：

zoom: 1; filter:  alpha(opacity=0); display: block;

这意味着将不透明度设置为0的过滤器是罪魁祸首。

- Henrik Ammer

---

好奇怪。我会尝试在打开幻灯片时更改过滤器值。 - GG.

正如在这个相关问题的答案中所看到的，http://stackoverflow.com/a/1333389/600101，应该使用`-ms-filter`来支持IE8，而不是`filter`。可能已在8月30日发布的jQuery 1.8.1中修复了此问题。 - Henrik Ammer

只需快速检查jQuery UI代码，错误必须来自jQuery而不是UI扩展。 - Henrik Ammer

你尝试过将jQuery更新到1.8.1吗？我在更新日志中看到一些与IE有关的问题已经得到解决。虽然我不确定它们是否相关，但值得一试。 - Henrik Ammer

是的，我更新了我的源代码，但没有任何更改。我只是在滑动效果之后添加了一个.css(//filter)。 - GG.

就像你说的那样：很奇怪。不管怎样，很高兴我能帮到你。 - Henrik Ammer

Answer 2

在 Henrik Ammer 的帮助下，该解决方案：

$(currentSlide)
    .show('slide', { direction: 'right' }, _config.effectDuration)
    .css({ '-ms-filter':'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)', 'filter':'alpha(opacity=100)'});

- GG.