下拉菜单在滑块上闪烁,仅适用于Android版Chrome

时间:2013-10-24 21:37:45

标签: javascript android jquery magento magento-1.7

我对这一切都很陌生,如果这是一个愚蠢的问题,请道歉:

我在这里有一个Magento网站:http://www.thisisnotavegetable.com它使用了响应式设计,当在移动宽度浏览器上显示时,topmenu变为启用了javascript的下拉列表。

这一切都很好,除了主页(通过启用javascript的滑块加载),以及仅适用于Android版Chrome。在该浏览器上,将不会显示下拉列表闪烁和链接文本。我认为这是一个jQuery问题,但我还不够先进,无法弄明白。

非常感谢任何帮助! 亚历

下面是下拉列表的jQuery(我认为)。滑块是ioSlider。我希望有人可以帮助我,而不需要看到jQuery,因为它没有格式化,许可证说我不应该发布它。

if (jQuery('#categories-accordion').length){
    jQuery('#categories-accordion li.level-top.parent ul.level0').before('<div class="btn-cat"><div class="inner"></div></div>');
    if(mobileDevice == true){
        jQuery('#categories-accordion li.level-top.parent').each(function(){
            jQuery(this).on({
                click: function (){
                    if(!jQuery(this).hasClass('touched')){
                        jQuery(this).addClass('touched closed').children('ul').slideToggle(200);
                        clearTouch(jQuery(this));
                        return false;
                    }
                }
            });
        });
    }else{
        jQuery('#categories-accordion li.level-top.parent .btn-cat').each(function(){
            jQuery(this).toggle(function(){
                jQuery(this).addClass('closed').next().slideToggle(200);
            },function(){
                jQuery(this).removeClass('closed').next().slideToggle(200);
            })
        });
    }
}

1 个答案:

答案 0 :(得分:2)

如果您可以发布jQuery代码,那会很棒:)

闪烁可能通过使用硬件加速来解决。您可以通过添加“-webkit-transform:translateZ(0);”强制浏览器使用硬件加速。进入移动菜单的css类。

      mobileMenu {
          ...
          -webkit-transform: translateZ(0);
          }