17

当我的页面加载时，我通过将其属性设置为无来 隐藏icon-refresh + icon-spin图标。display

现在，在执行了一些操作后，我希望显示这个图标。.show()我在图标上调用 jQuery 的方法。但是，在显示图标时，图标不再旋转。

如果我加载它而不最初隐藏它，它会旋转。但不是当它被隐藏并稍后显示时。

编辑：如果标题不清楚，我正在使用Font Awesome来显示图标

4

4 回答 4

28

你必须使用$element.css("display","inline-block");而不是.show();

于 2013-07-01T11:26:20.447 回答
1

老话题，但我有类似的问题，“fa-spin”在使用 {可见性：隐藏}隐藏包含元素后不起作用，使用 jQuery 设置。还有一些其他动画涉及，这可能导致时间问题等。

修复方法是在包含元素上设置一个事件以使其再次可见时触发，这会触发此函数：

ply_obj.container.on(
            'controlsshown',
            function () {

                if (ply_obj.config.loop_tf) {
                    ply_obj.loop_icon.removeClass('fa-spin');
                    setTimeout(function () { ply_obj.loop_icon.addClass('fa-spin'); }, 100);
                }
            }
        );

因此，删除“fa-spin”，然后稍加延迟将其添加回来，使其按我的需要工作。

于 2015-12-04T16:18:30.333 回答
0

您是在调用“$('#mySpinnerElement').hide() 吗？

我将其更改为 document.getElementById('mySpinnerElement').style.display = 'none';

我的微调器在随后的调用中旋转

高温高压

沼泽

于 2013-05-27T12:08:24.440 回答
0

如果初始显示状态为 ，似乎 IE10 不会运行旋转动画none。我发现动态更改显示inline-block不会触发旋转动画。将微调器移出屏幕解决了这个问题。例如：

.icon-spinner {
    position: absolute;
    left: -9999px;
}
.is-pending .icon-spinner {
    left: 0;
}
于 2014-03-03T10:37:39.077 回答