Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 25.06.2017, 20:37
Аспирант
Отправить личное сообщение для Jolly Посмотреть профиль Найти все сообщения от Jolly
 
Регистрация: 11.03.2017
Сообщений: 40

Фиксированное меню с скролом, без overlaw:auto.
Здравствуйте.

Есть фиксированное меню на Js, вроде бы все отлично, но есть одно "НО". Когда меню не помещается на экране, оно не прокручивается. Пробовала ставить overlaw:auto, но оно почему-то не подходит. Так же оно не подходит, так как в меню есть подменю, которое располагается справа,и если ставить значение overlaw:auto, оно обрезает подменю. Уже неделю бьюсь, не знаю как решить , подскажите пожалуйста варианты.

Вот код JS:
(function(){  
var a = document.querySelector('#left-col'), b = null;  
window.addEventListener('scroll', Ascroll, false);
document.body.addEventListener('scroll', Ascroll, false);  
function Ascroll() {
  if (b == null) {  
    var Sa = getComputedStyle(a, ''), s = '';
    for (var i = 0; i < Sa.length; i++) {  
      if (Sa[i].indexOf('border') == 0 || Sa[i].indexOf('outline') == 0 || Sa[i].indexOf('box-shadow') == 0 || Sa[i].indexOf('background') == 0) {
        s += Sa[i] + ': ' +Sa.getPropertyValue(Sa[i]) + '; '
      }
    }
    b = document.createElement('div');  
    b.style.cssText = s + ' box-sizing: border-box; width: ' + a.offsetWidth + 'px;';
    a.insertBefore(b, a.firstChild);  
    var l = a.childNodes.length;
    for (var i = 1; i < l; i++) {  
      b.appendChild(a.childNodes[1]);
    }
    a.style.height = b.getBoundingClientRect().height + 'px'; 
    a.style.padding = '0';
    a.style.border = '0';  
  }
  if (a.getBoundingClientRect().top <= 0) { 
    b.className = 'sticky';
  } else {
    b.className = '';
  }
  
  window.addEventListener('resize', function() {
    a.children[0].style.width = getComputedStyle(a, '').width
  }, false);  
}
})()

.sticky {
  position: fixed;
  top: 90px;  
}
Ответить с цитированием
  #2 (permalink)  
Старый 25.06.2017, 21:13
Аватар для j0hnik
Профессор
Отправить личное сообщение для j0hnik Посмотреть профиль Найти все сообщения от j0hnik
 
Регистрация: 01.12.2016
Сообщений: 3,650

width: 100%
не правильно написано
overlaw:auto
overflow:auto

Последний раз редактировалось j0hnik, 25.06.2017 в 21:30.
Ответить с цитированием
  #3 (permalink)  
Старый 25.06.2017, 21:57
Аспирант
Отправить личное сообщение для Jolly Посмотреть профиль Найти все сообщения от Jolly
 
Регистрация: 11.03.2017
Сообщений: 40

j0hnik,
Прошу прощения, не правильно написала. width: 100% в стиль добавить или в js?
Ответить с цитированием
  #4 (permalink)  
Старый 25.06.2017, 22:42
Аватар для j0hnik
Профессор
Отправить личное сообщение для j0hnik Посмотреть профиль Найти все сообщения от j0hnik
 
Регистрация: 01.12.2016
Сообщений: 3,650

в стиль
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Выпадающее меню (костыли) Sk1LL Общие вопросы Javascript 4 06.02.2016 12:47
Ищу jQuery плагин для создания меню Zeboton jQuery 9 15.09.2014 15:31
меню в IE 6 без стилей AndreyT (X)HTML/CSS 1 15.04.2010 21:17
Как "переключать" картинки в меню навигации? KirTer Элементы интерфейса 1 22.06.2009 11:49
Событие mouseout при наведении мыши на пункт меню WalterScott Events/DOM/Window 2 12.05.2009 22:05