Главная Wp-Recall WP-Recall: Предложения и идеи Левое меню Recallbar в мобильной версии
7 ответ(ов) в теме
CosworthRS
не в сети 8 месяцев
На сайте с 24.04.2017
Участник
Тем 6
Сообщения 25
1
17:39

Версия WP-Recall: 16.7.4

Меню Recallbar сворачивается в иконку, при наведении мышкой оно разворачивается, но возникла сложность с мобильными устройствами. Не всегда удобно открытие меню при наведении, проще клик. Один раз кликнул- меню открылось, второй раз по иконке меню кликнул- меню закрылось. В связи с эти написал коротенький скрипт, который добавляется в файл functions.php активной темы.

//Меню в мобильной версии Recallbar
add_action('wp_footer', 'left_menu_rcl');
function left_menu_rcl(){
?>
<script type="text/javascript">                 
jQuery(function($){
    $("#recallbar .rcb_left_menu").toggle(
  function () {
    $('#recallbar .rcb_menu').css({opacity:'1',visibility:'visible',top:'36px'});
  },
  function () {
    $('#recallbar .rcb_menu').css({opacity:'0',visibility:'hidden',top:'54px'});
  });
});
</script>
<?php
}

левое меню recallbar

0
Otshelnik-Fm
не в сети 6 часов
На сайте с 27.01.2013
Модератор
Тем 26
Сообщения 10894
2
18:06

CosworthRS сказал(а)
Не всегда удобно открытие меню при наведении, проще клик.

Я тестировал на мобильном дефолтное меню реколлбара - кликнув по иконке меню раскрывается
Единственное отличие - тапнуть надо чтобы закрылось не по иконке - а по пустому пространству

p.s. type="text/javascript" - уже давно не требуется указывать.ю Браузеры поддерживают, валидаторы принимают короткий тег

0
CosworthRS
не в сети 8 месяцев
На сайте с 24.04.2017
Участник
Тем 6
Сообщения 25
3
18:13

Я тестировал на мобильном дефолтное меню реколлбара - кликнув по иконке меню раскрывается

С мобильниками порой возникают разные причуды, зависит от производителя, версии ПО и другого. У меня не на всех опробованных мобильниках корректно работает.
P.S. За инфу, спасибо.
P.P.S. Можно и слайдер сделать на чистом CSS, но опять же, не везде работает.

0
CosworthRS
не в сети 8 месяцев
На сайте с 24.04.2017
Участник
Тем 6
Сообщения 25
4
05:48

Но после теста на разных устройствах, решил отказаться от варианта одновременного использования клика и Hover (наведение мыши на объект). Для мобильных версий оставил только клик, так как hover не всегда хорошо работает. Зависит от производителя, модели оборудования, встроенного ПО. Так же убрал полностью левое меню для оборудования с разрешением от 1300 пикселей, так как используется основное меню.

add_action('wp_footer', 'left_menu_rcl');
function left_menu_rcl(){
?>
<script>                 
jQuery(function($){
    $("#recallbar .rcb_left_menu").toggle(
  function () {
    $('#recallbar .rcb_menu').css({opacity:'1',visibility:'visible',top:'36px'});
  },
  function () {
    $('#recallbar .rcb_menu').css({opacity:'0',visibility:'hidden',top:'56px'});
  });
});
</script>
<?php
}

Вот такой код получился, по сути, тоже самое, только в одном месте отступ больше, чтобы сохранить все дефолтные настройки CSS, но в добавок к нему надо изменить шаблон Recallbar, чтобы всплывающее меню перестало быть дочерним элементом для блока <div class=’rcb_left_menu’>

Редакции сообщения
30.10.2017 05:50CosworthRSПричина: не указано
0
garry
не в сети 54 минуты
На сайте с 04.01.2014
Участник
Тем 89
Сообщения 1306
5
08:15

CosworthRS сказал(а)
Можно и слайдер сделать на чистом CSS, но опять же, не везде работает.

А на яблочных может вообще не работать.))
Кстати, ни кто не знает сервиса тестов, не за 50 баксов проверить? Все, что адекватное находил, только за абонентку.

0
thipak91@gmail.com
не в сети 3 месяца
На сайте с 05.12.2017
Участник
Тем 9
Сообщения 66
6
09:59

Здравствуйте, как сделать чтоб на десктопе было меню без выпадающего списка, а на мобильном с выпадающим списком?

0
Otshelnik-Fm
не в сети 6 часов
На сайте с 27.01.2013
Модератор
Тем 26
Сообщения 10894
7
10:10

Что этот вопрос делает в чужой теме и не по теме? Создавайте свою тему

0
Вы не имеете права на публикацию сообщений в этой теме