Раскрывающееся меню, мерцающее над слайдером, только в Chrome для Android

0

Я новичок во всем этом, поэтому извиняюсь, если это глупый вопрос:

У меня есть сайт Magento, расположенный здесь: http://www.thisisnotavegetable.com. Он использует отзывчивый дизайн, а при отображении в браузерах ширины в браузере topmenu становится выпадающим списком с поддержкой javascript.

Все это прекрасно работает, за исключением домашней страницы (где она загружается с помощью слайдера с поддержкой javascript) и только для Chrome для Android. В этом браузере выпадающие мигания и текст ссылки не отображаются. Я предполагаю, что это проблема jQuery, но я недостаточно продвинутый, чтобы понять это.

Любая помощь высоко ценится! Alex

Ниже приведен 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);
            })
        });
    }
}
Теги:
magento
magento-1.7

1 ответ

2

Было бы здорово, если бы вы могли опубликовать код jQuery :)

Мерцание может быть решено с помощью аппаратного ускорения. Вы можете заставить браузер использовать аппаратное ускорение, добавив "-webkit-transform: translateZ (0);" в класс css мобильного меню.

      mobileMenu {
          ...
          -webkit-transform: translateZ(0);
          }
  • 0
    Спасибо, Фил. Я попробовал это, но на самом деле это вызвало мерцание на каждой другой странице, а не только на домашней странице (где она мерцает только сверху слайдера). Опять же, это только на Chrome для Android. В любом другом браузере это нормально! Я добавил код JQuery для выпадающего списка. Могу ли я добавить еще что-нибудь, чтобы помочь? Спасибо!
  • 0
    Привет Алекс, извини за поздний ответ. Не знаю, если вы уже решили проблему. Я думаю, было бы неплохо, если бы вы использовали CSS-преобразование для анимации выпадающего меню. Лучшая производительность, и я думаю, что это должно исправить проблему мерцания.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню