3

我的网站有多个页面，每个页面顶部都有一个重复的导航菜单。这适用于 PC 上的每个浏览器。但是，在 Mac 上的 safari 或 iPad 上，它仅适用于某些页面。

在肖像页面上，下拉菜单“信息”中的文本消失，客户区下拉菜单中的文本也消失。

这些菜单在所有其他页面上都可以正常工作，并且代码完全相同，我复制并粘贴了它，所以我真的不明白为什么会发生这种情况。链接仍然有效，如果您单击空白区域，它会将您带到链接，但您实际上看不到您单击的内容。

我已经更新了我所有的 JavaScript 文件，想不出还有什么可以尝试的。

www.yorkshirephotographer.net

代码：

jQuery(document).ready(function(){
    /* for top navigation */
    jQuery(" #menu ul ").css({display: "none"}); // Opera Fix
    jQuery(" #menu li").hover(function(){
        jQuery(this).find('ul:first').css({visibility: "visible",display: "none"}).slideDown(400);
    },function(){
        jQuery(this).find('ul:first').css({visibility: "hidden"});
    });
    jQuery(" #menu2 ul ").css({display: "none"}); // Opera Fix
    jQuery(" #menu2 li").hover(function(){
        jQuery(this).find('ul:first').css({visibility: "visible",display: "none"}).slideDown(400);
    },function(){
        jQuery(this).find('ul:first').css({visibility: "hidden"});
    });
});
4

1 回答 1

0

这可能是渲染问题。尝试向您的元素添加一些修复 css：

-webkit-transform: translateZ(0);

它应该强制渲染......你可以用这样的javascript来做到这一点：

jQuery("#menu ul, #menu li").css("-webkit-transform", "translateZ(0)");

您还可以将 css 属性应用于#menu. 我也会添加锚选择器：

jQuery("#menu, #menu ul, #menu li, #menu a").css("-webkit-transform", "translateZ(0)");

如果它仍然不起作用，请尝试移除 cufons。

于 2012-09-12T08:54:45.513 回答