AlexZaw

можно поподробнее? как в таком случае правильно написать код?

ясно, т.е. работает точно также как простой цикл for, а в чем преимущество? кстати если делать проверку введенного значения, то вместо (value <= 3) лучше сделать (value <= images.length) хотя на мой взгляд тут проверка не нужна, пусть хоть буквы вводят, код не поломается

если я правильно понял вопрос то читайте про всплытие и перехват. https://learn.javascript.ru/event-bubbling

а если только с одним классом? без img1,img2,img3 ?

if (fio.typeof == "number" || comp.typeof !== "number" || mail.typeof !== "number") как то так, но лучше объединить все нужные инпуты в массив и перебирать циклом.

отслеживание элемента по которому кликнули все равно придется делать, а такая запись короче и не приходится вводить доп класс

подозреваю что именно из-за forEach и не работает, у меня голова сейчас не варит, время 4 утра, но кажется логические условия не совсем правильные, точнее совсем неправильные ну ладно с этим if(arr.indexOf(Number(input.value)) != -1) { img[Number(input.value)].classList.remove('hidden'); проверяем не равен ли индекс массива -1 и убираем класс hidden у картинки с нормальным индексом, хотя зачем мы делаем такую проверку совсем непонятно. а вот здесь if(input.value === '') { img[0].classList.add('hidden'); img[1].classList.add('hidden'); img[2].classList.add('hidden'); } img от i работать и не будет так как i нам взять негде, и даже если img.forEach(function(element, i) интерпретатор понимает правильно, хотя в этом я не уверен (сам с forEach не работал поэтому могу и ошибаться), то i оттуда не передается, так как метод forEach нам ничего не возвращает вот как то так

https://learn.javascript.ru/obtaining-event-object вот тут про event можно почитать

не совсем так, в id кнопка записывается только тогда когда кликнули именно по ней, если бы у нас были несколько кнопок с таким data-атрибутом, но с разными value, то каждая кнопка ссылалась бы на свой элемент, если мы кликнули на элементе у которого нет этого дата-атрибута, то в id записывается null либо пустая строка. код вполне себе полный и рабочий - показывает и скрывает форму при нажатии на кнопку, нажали один раз - форма появилась, нажали еще раз - исчезла

да тут вроде все понятно: document.onclick = function(event) { //при событии клика на область документа выполняется функция принимающая event var target = event.target; // в переменную target присваивается DOM элемент по которому произошел клик var id = target.getAttribute('data-toggle-id'); //в переменную id присваиваем значение аттрибута data-toggle-id элемента target if (!id) return; // если в id нет значения (getAttribute вернул null, а значит if возвращает ложь), выходим из функции var elem = document.getElementById(id); //если получили значение - присваеваем переменной elem элемент DOM со значением хранящемся в id elem.hidden = !elem.hidden; // присваиваем полученному элементу обратное значение аттрибута hidden (если есть - убираем, если нет - добавляем };

при forEach придется еще с callback-ом заморачиваться, а оно нам для данной задачи надо?

em и % зависят от размера шрифта по умолчанию (ну или от размеров шрифта которые мы задаем для родителя), что не всегда удобно высчитывать. плагин высчитывает размер шрифта налету, исходя из ширины элемента в котором располагается текст, что тоже должно быть не совсем удобно, особенно при блоках разной ширины. попробовать я думаю стоит, а там уже решить в каких случаях использовать плагин, а в каких проценты и ем

сделайте переменную tor не глобальной, должно помочь

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

можно покороче, плюс тут любое кол-во картинок: var input = document.querySelector('.input'); var images = document.querySelectorAll('.img'); input.oninput = function () { for (var i = 0; i < images.length; i++) { if (input.value === "") { images[i].classList.add('hidden') } else { images[input.value - 1].classList.remove('hidden') } } } html и css тот же

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

можно попробовать для мобильных задать max-width

спасибо, подозревал что где то там можно посмотреть, но попало между глаз видать когда сам искал за сайтики тоже спасибо, пригодятся!

а можно узнать каким образом это посчитано? отдельная прога или какие то штатные средства?

можно еще вот здесь почитать, если нужно именно определение устройства с которого зашли. можно попробовать еще поиграться с @media handheld и прописать отдельный файл стилей для видео

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

как то так: @media screen and (max-width:нужный размер){ меняем стили } либо так: Нужно добавление видео на страницу вынести в JS. Для этого в HTML создаёте контейнер к примеру <div id="video-container"></div> А после загрузки страницы проверяете ширину экрана и если всё хорошо, то добавляете видео <script> window.onload = function(){ if(window.innerWidth >= нужная ширина) document.getElementById('video-container').innerHTML = '<video autoplay id="" poster=""><source src="" type="video/mp4"></video>' }; </script> айдишник и пути прописывает какие надо

Вообще-то, по стандарту, id должен быть уникальным для всей страницы, а никак не по желанию, а то что можно задать несколько одинаковых id (можно даже кириллицей название задавать, и потом в css свойства прописывать) и все будет работать, то это, как говорится в одном анекдоте, - "не ваша заслуга, а наша недоработка"

можно попробовать с градиентами http://lea.verou.me/css3patterns/#wave но Влад прав, не стоит оно того

а почему вместо текста картинки?