3

我有一个奇怪的问题，在 Mac 上的 Chrome 和 Safari 中都看不到某些文本。

在所有其他浏览器中，文本是完全可见的，我不知道为什么会这样。我在 Firebug 和 Chrome Developer 工具中调试过，但没有成功。

这是一个例子：

火狐 在此处输入图像描述

铬合金 在此处输入图像描述

更新：这里是 Javascript：

function openProductInfo() {
    closeAllProductInfo();
    $('#overlay').show();
    $('#info').css({visibility: 'visible', opacity: 0});
    $('#info').animate({opacity: 1}, 250);
    $('#options a.info').addClass('active');
    infoVisible = true;
}

$('.info').click(function() {
    if (infoVisible) { 
        $('#info').animate({opacity: 0}, 250, function() {  
            closeAllProductInfo(); 
        }); 
    } else { 
        openProductInfo(); 
    }

    return false;
});

$('#overlay').click(function() {
    if (infoVisible) { 
        $('#info').animate({opacity:0}, 250, function() { 
            closeAllProductInfo(); 
        }); 
    }
});

这是现场直播：

http://fine-grain-2.myshopify.com/products/the-bowden-black-walnut

4

3 回答 3

1

我已经在 Chrome 中测试过了。'#info' div 似乎是隐藏的（可见性：隐藏）。您可能要考虑使用“显示”而不是“可见性”。

于 2013-02-26T23:20:14.157 回答
1

好的，我终于弄清楚了问题所在。

我正在@font-face为这个站点使用字体，并且由于某种原因，当我使用AvenirLight而不是Avenir正文字体时，它使仅与 CSS3 转换和 JavaScript 转换相关联的文本不可见。

我仍然不知道为什么会发生这种情况，以及为什么它只发生在 Mac 上的 webkit 浏览器中。

让我们尝试解决这个问题！

这是我的@font-face声明：

@font-face {
    font-family: "Avenir";
    font-style: normal;
    font-weight: 600;
    src: url("AvenirLTStd-Medium.otf") format("opentype");
}
@font-face {
    font-family: "AvenirBold";
    font-style: normal;
    font-weight: 600;
    src: url("AvenirLTStd-Black.otf") format("opentype");
}
@font-face {
    font-family: "AvenirLight";
    font-style: normal;
    font-weight: 600;
    src: url("12-Avenir-Light.ttf") format("opentype");
}

这是我声明的地方body font-family：

body {
    background: none repeat scroll 0 0 #999999;
    font-family: Avenir;
    font-weight: normal;
}
于 2013-02-27T11:31:11.427 回答
0

如果您将 CSS3transition属性应用到应用了属性的#infodiv，即使在某个状态visibility:hidden;后应用 a 后，它也不会显示。visibility: visible;

我也遇到了这个问题，我不得不transition从该 div 中删除该属性。尝试删除 CSS3transition属性，看看是否有效。

于 2013-12-07T00:45:34.263 回答