Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
 
Рейтинг 5.00/8: Рейтинг темы: голосов - 8, средняя оценка - 5.00
10 / 10 / 2
Регистрация: 29.05.2011
Сообщений: 533
1

Пункты меню отображаются не полностью

04.05.2017, 11:25. Показов 1586. Ответов 6
Метки нет (Все метки)

Доброго времени суток!
Перестало отображаться меню заходя на сайт с мобильного.
Найден код
CSS
1
2
3
4
5
6
7
8
9
@media (max-width:569px)                            {
    .bx-touch .header_inner_include_aria{padding-top:10px}
    .bx-touch .header_wrap{padding-top:60px}
    .bx-touch .site_title,
    .bx-touch .cart_block,
    .bx-touch .login_block,
    .bx-touch .bx_cart_login_top,
    .bx-touch .header_inner_bottom_line>div,
    .bx-touch .header_top_section{display:none;}
.bx-touch .header_inner_bottom_line>div как раз и скрывал.
После чего подкорректировав .bx-touch .header_inner_bottom_line>div меню стало отображаться.
Но пункты меню не влезают в блок [del]
Пункты меню отображаются не полностью


Подскажите, пожалуйста, каким образом сделать так чтоб все пункты помещались.

Пункты меню сделаны списком. При обычном разрешении экрана у данных пунктов автоматически устанавливается ширина [del]
Пункты меню отображаются не полностью

Как можно сделать так, чтоб при max-width:569px данные стили не применялись?

 Комментарий модератора 
Изображения и любые другие файлы загружайте на форум! (Правила п.4.11)
__________________
Помощь в написании контрольных, курсовых и дипломных работ здесь
0
Лучшие ответы (1)
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
04.05.2017, 11:25
Ответы с готовыми решениями:

Глючит бургер меню, не попадает на пункты меню
http://cadinstruktor.kl.com.ua

Новые созданные пункты меню не отображаются на сайте
Новые созданные пункты меню не отображаются на сайте, при этом старые могу редактировать, удалять,...

Не отображаются пункты с контактными данными в таблице
Здравствуйте, форумчане. Я разрабатываю программу и у меня такая ошибка, что в форме с регистрацией...

Переместить пункт меню/поменять пункты меню местами
Добрый день! В битриксе довольно недолго и столкнулся с такой проблемой: Есть страница "step by...

6
10 / 10 / 2
Регистрация: 29.05.2011
Сообщений: 533
04.05.2017, 12:37  [ТС] 2
При неполной загрузки страницы пункты меню отображаются полностью (скрин во вложении)
Но как отследить какие именно стили отвечают за такое отображение меню?
Миниатюры
Пункты меню отображаются не полностью  
0
10 / 10 / 2
Регистрация: 29.05.2011
Сообщений: 533
05.05.2017, 10:35  [ТС] 3
Сейчас пункты накладываются друг на друга
Подскажите, пожалуйста, каким образом сделать так, чтоб пункты переносились на след строку.
Миниатюры
Пункты меню отображаются не полностью  
0
Модератор
Эксперт JSЭксперт HTML/CSS
3764 / 2661 / 1518
Регистрация: 12.07.2015
Сообщений: 6,661
Записей в блоге: 4
05.05.2017, 12:14 4
Лучший ответ Сообщение было отмечено _marisha как решение

Решение

_marisha, Как минимум, надо привести код, который даст возможность воспроизвести проблему. Или дать ссылку на страницу. Что там у вас происходит, по картинкам не видно.

Добавлено через 35 минут
Потому что, у вас скрипт(или вы) выставляет пунктам ширину такую, чтобы они все умещались в одной строке, поэтому и не переносятся.
1
10 / 10 / 2
Регистрация: 29.05.2011
Сообщений: 533
05.05.2017, 12:45  [ТС] 5
mrtoxas, спасибо огромное, Вы очень помогли/натолкнули на мысль.
В шаблоне меню есть файл script.js видимо в нем происходит выставление ширины пунктам меню.
Если закомментировать CatalogHorizontal.prototype.resizeMenu = function(), то пункты меню при малом разрешении перестают наезжать друг на друга, а происходит переход на другую строку (почти так и нужно).
А возможно ли в CatalogHorizontal.prototype.resizeMenu = function() сделать условие, чтоб выставление ширины пунктов меню начиналось с 768px?
А то при нормальном разрешении пункты меню "прилипают" к левому краю, а справа остается пустое место.

Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
CatalogHorizontal.prototype.resizeMenu = function()
    {
        if (screen.width >= '767') 
        {
        var widthSum = 0; // sum of width for all li
        var wpa;
 
        var firstLevelLi = BX.findChildren(BX(this.menuBlockId), {className : "bx_hma_one_lvl"}, true);
 
        if (firstLevelLi)
        {
            for(var i = 0; i < firstLevelLi.length; i++)
            {
                wpa = BX.firstChild(firstLevelLi[i]).clientWidth;
                widthSum += wpa;
            }
 
            if((widthSum+20) <= this.catalogMenuFirstWidth)
                BX.addClass(BX(this.menuBlockId), "small");   //adaptive
            else
                BX.removeClass(BX(this.menuBlockId), "small");
        }
 
        return widthSum;
        }
    };
Вложения
Тип файла: zip script.zip (1.6 Кб, 1 просмотров)
0
Модератор
Эксперт JSЭксперт HTML/CSS
3764 / 2661 / 1518
Регистрация: 12.07.2015
Сообщений: 6,661
Записей в блоге: 4
05.05.2017, 13:45 6
_marisha, для всего, что связано со скриптами, у нас есть отдельная ветка.
0
10 / 10 / 2
Регистрация: 29.05.2011
Сообщений: 533
16.05.2017, 13:40  [ТС] 7
mrtoxas, спасибо большое за помощь.
Благодаря Вам найдено то место, где происходило выставление ширины пунктам меню.
0
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
16.05.2017, 13:40

Wayfinder Modx. Меню выпадает, но пункты меню не кликаются
Добрый день! Подпункты меню переходят на внутренние страницы, а первый ряд пунктов нет. Мышкой...

Вставка изображений (не отображаются полностью)
Здравствуйте. Есть такая проблема. составляю книгу, и когда дело дошло до вставки изображений в...

Введенные данные отображаются не полностью
Непойму чего твориться! Передаю текст из texetarea в базу данных (поле MEMO) и записываеться только...

На YouTube не полностью отображаются комментарии?
Открываю видео на Ютуб, вижу большой комментарий, читаю его и в конце он ОБРЫВАЕТСЯ, видно что...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
7
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2021, vBulletin Solutions, Inc.