Question

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

在人像拍摄页面上时，下拉菜单“信息”中的文字会消失，客户区下拉菜单中的文字也会消失。

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

我已经更新了我的所有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"});
    });
});

Answer 1

它可能是一个渲染问题。尝试在元素中添加一些修复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。

JavaScript下拉菜单 - Mac上的零件消失了吗？

1 个答案: