andrey7287

https://jsfiddle.net/8621zb6w/

Такие вещи делаются одним обработчиком и одной переменной.

window.onscroll = function(){ window.pageYOffset < 200 ? elem.className = 'main-navbar' : elem.className = 'main-navbar2'; }

Прежде всего спасибо за материал. Это очень круто что в рунете теперь есть такие ресурсы на которых появляется интересный и уникальный контент по веб. По поводу сабжа, для меня лично это открытие. Очень впечатляют возможности. Уверен что за этим будущее, а блочная верстка, в том числе и флексами, будет восприниматься как сейчас табличная. Так что если отбросить на задний план поддержку браузерами, личные предпочтения и религиозные убеждения, однозначно можно заключить что у флексов нет никаких преимуществ. А вот разделение лэйаута и оформления отдельных элементов, открывает массу возможностей как на этапе построения сайта так и его поддержки. Фактически можно будет легко и быстро перестроить любой сайт без ограничений не замарачиваясь падингами и маргинами отдельных его частей.

нет, только css, вот гайд http://jemand.ru/gorizontalnoe-vypadayushhee-menyu-na-css/

.feedback { top: 200px; }

Значит на классические грабли с отступами между элементами меню ещё не наступали.

По мне так reset удобен. Читал что он серьёзно снижает быстродействие. Если это действительно так, то это повод от него отказаться, хотя есть большие сомнения в том что это действительно так.

Из за inline-block у внутренних элементов.

Учимся использовать девтул

То есть ? Оно и так не закрывается.

Не вник в суть побочных эффектов, но на css всё это нормально делается http://jemand.ru/examples/gorizontalnoe-vypadayushhee-menyu-na-css.html

counter зачем если можно напрямую читать и писать значение. в данной реализации проще onclick.

Отличная затея. Можно ещё серверный сценарий на asp написать.

Код приведите. ЗЫ Как вы вообще написали обработчик, если не можете 1 строчку кода в него добавить.

Это эксклюзивные фишки htmlforum.ru, даже w3c пока не в курсе. https://jsfiddle.net/Andrey7287/4xkmuppk/2/

@Sergey_K_2015 В приведенном примере БЭМ используется не правильно. Через "--" задаётся модификатор (main-menu--open), а элемент через "__" (main-menu__item). И не стоит всем элементам давать классы, становитесь заложником технологии.

А зачем ты повторно ищешь элемент, который у тебя в this ...

Я думаю что не совсем. Хотя твоя функция технически и работает как конструктор, на практике return насколько я знаю никогда не используется. Свойства возвращаемого объекта задаются через this. Сами свойства не обязательно должны быть объектам, а вот в качестве аргумента конструктора как правило используют объекты. То есть в твоей реализации выйдет вот что. function Calculator(obj){ this.el = obj.el; // Элемент с калькулятором this.field = obj.el.querySelector('.field'); // Элемент с экраном калькулятора this.do = ['']; // Массив с действиями калькулятор в формате [1,'+',2] this.math = { // Обьект с операторами '+': function(x,y) {return x + y}, '-': function(x,y) {return x - y}, '×': function(x,y) {return x * y}, '÷': function(x,y) {return x / y} }; this.clear = function() { // Метод для очистки экрана калькулятора this.do = ['']; this.updateField(); }; this.updateField = function () { // Метод для обновления значений на экране калькуляторе var text = ''; for(var i = 0; i < this.do.length;i++){ text += ' ' + (this.do[i] === '' ? (this.do.length-1 !== i ? '0' : '') : this.do[i]); } this.field.innerHTML = text; }; this.pressButton = function (text) { // Метод обрабатывающий нажатие кнопок калькулятора var num = text !== '.' ? parseFloat(text) : '.'; if(text === 'Clear') { // Если нажата кнопка Clear this.clear(); } else if (!isNaN(num) || text === '.') { // Если нажата кнопка с числом или точка var last = this.do[this.do.length-1]; last += last.length === 0 && num === '.' ? '0.' : String(num); var txt = last.split('.'); txt = txt.length > 1 ? String(parseInt(txt[0]))+'.'+txt[1]: parseInt(txt[0]); this.do[this.do.length-1] = txt; this.updateField(); } else { // Если нажата кнопка с оператором if(text === '=' && this.do.length >= 3 && this.do[this.do.length-1] !== '') { var result = parseFloat(this.do[0]); result = isNaN(result) ? 0 : result; this.do.splice(0,1); while(this.do.length > 0) { result = this.math[this.do[0]](result, parseFloat(this.do[1] === '' ? 0 : this.do[1])); this.do.splice(0,2); } this.do = [result]; this.field.innerHTML = result; } else if(text !== '=') { this.do.push(text, ''); this.updateField(); } } }; // Метод инициализации в котором вешается обработчик на клик на калькулятор var $this = this; this.el.onclick = function (event) { var target = event.target; if(target.tagName === 'BUTTON') { $this.pressButton(target.innerHTML); } }}Создание объекта калькулятор. var calc = new Calculator({el: document.querySelector('.calculator')}); Запуск calc.init(); Но один фиг это не то что надо. Так как объекту калькулятор все эти методы, которые ты в него напихал не нужны. Никто не будет запускать calc.updateField() , по этому это свойство должно быть в прототипе. ЗЫ Если где не прав, исправляйте. Сам учусь. ЗЫЫ Калькулятор кстати не правильно работает, попробуй 2+2*2 По ооп и прототипам намного лучше Кантора будет Николас Закас .

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

Ну так в приведённых тобой примерах jQuery ничего полезного кроме делегирования не делает. С таким же успехом можно было всё написать на пьюр JS / А компонентный подход на jQ ?

Это же как оригинал Попробуйте ещё раз! Не ту ссылку сначала вставил а вы её успели открыть.

# перед block-left, container и block-right поставьте. Как блоки могут быть фиксированными, если ширина задана в % ? html, body{height: 100%;width: 100%;-webkit-background-size: content-box;-moz-background-size: content-box;box-sizing:content-box;}Это зачем вообще ?

как вариант она определяется css правилами, работающими в текущий момент

https://jsfiddle.net/Andrey7287/ajrruwxt/