Ответы пользователя по тегу JavaScript
  • Почему не работает скприпт?

    Libiros
    @Libiros
    Frontend developer
    Попробуйте строгое сравнение

    if (ariaExpanded === false) {
    Ответ написан
    Комментировать
  • Как сделать расширение элемента в обе стороны с сохранением позиции?

    Libiros
    @Libiros
    Frontend developer
    В пункте 4 непонятно, о чем говорится. Что вы имеете в виду?

    Пункт 5:
    Во-первых, если вы будете осуществлять пункт 6, то нужно ловить событие onmousedown на триггерах. То есть не
    $block.on('mousedown',  '.block_range-motion-trigger',  function() {
      motion();
    });

    а
    $(".block_range-motion-trigger").on('mousedown',  function() {
      motion();
    });


    Во-вторых, посмотрите внимательно, вправо расширяется нормально, а влево нет по следующей причине:
    $eMotion.css({ 'width': motionWidth});
    Когда вы расширяете блок вправо, он увеличивает width. А когда влево, то уменьшает (логично, вроде). Но вы считаете motionWidth от начала блока, а уменьшаете влево от него и получаете отрицательные значения.

    Короче, при расширении влево, значение width становится отрицательным.
    А скачет при нажатии на левый триггер потому, что расчет идет с помощью координат. Левый триггер находится левее, отсчет начинается почти от начала координат. Так как триггер находится левее, блок сужается до минимального.

    Ваша задача решится, как только вы начнете пересчитывать motionWidth по-другому.
    Ответ написан
    Комментировать
  • Почему чекбокс и радио undefined?

    Libiros
    @Libiros
    Frontend developer
    Вот вариант без JQuery. Я дописал в Ваш HTML сразу после /form кнопку, по которой получаем результат.

    <button id="result">result</button>

    (function () {
    
      var item = document.getElementsByClassName("item"),
          input;
    
      var itemLength = item.length;
    
      // Эту функцию повесим на кнопку. При клике будем вызывать. Функция создаст массив arr, куда будет записывать необходимые данные.
      var getResult = function () {
        var arr = [];
        
        // В каждом .item...
        for (var i = 0; i < itemLength; i++) {
          input = item[i].getElementsByTagName("input");
          var inputLength = input.length;
    
          // Возьмем все input'ы в каждом взятом .item
          for (var j = 0; j < input.length; j++) {
    
            // Если наш инпут является чекбоксом или радио, то проверим на то, чекнут он или нет и запишем значение в массив
            if (input[j].type === "checkbox" || input[j].type === "radio") {
              if (input[j].checked) {
                arr.push(input[j].value);
              }
            // Это для всех не_чекбоксов и не_радио
            } else {
              arr.push(input[j].value);
            }
          }
        }
        
        // Надо же посмотреть на массив, да?
        console.log(arr);
      
      }
    
      var result = document.getElementById("result");
      result.addEventListener("click", getResult, false);
    
    })();
    Ответ написан
    2 комментария
  • Отправка формы до нажатия на кнопку отправки клиентом?

    Libiros
    @Libiros
    Frontend developer
    Если есть какая-то валидация формы с телефоном (должна быть, ну). То есть вариант отслеживать событие on input. Как только валидация пройдена, сразу отправлять на сервер.

    Псевдокод:
    input.addEventListener(input, validation);

    Где validation содержит проверку на валидность введенного номера телефона, а дальше:
    var validation = function() {
      ...
      if (formIsValid) {
        // отправляем на сервер и не ждем
      }
      ...
    }


    P.S. Если валидации нет, то придумайте сами самую простую. 11 чисел - самое простое. Регулярные выражения на 15 минут сложнее.
    Ответ написан
    Комментировать
  • Как увеличить блок при наведении?

    Libiros
    @Libiros
    Frontend developer
    Можно попробовать так:

    jsfiddle.net/hd758bwo

    Осталось подставить свои значения. Также можно играть с CSS для достижения нужного эффекта.

    .main-div - обертка, можно убрать
    .card - сама карточка, которая увеличивается и открывает скрытые блоки .card__hidden-*

    Сделал с анимацией, с помощью transition. Можно анимацию вообще убрать и тогда задача упростится, так как в классы .card__hidden-* можно поставить свойство display:none и при событии .card:hover делать скрытым блокам display:block. Тогда получится как в Вашем примере.
    Ответ написан
  • Как передать background-gradient в JQuery?

    Libiros
    @Libiros
    Frontend developer
    (function() {
      var buttonsColor = $('button[data-color]');
    
      buttonsColor.each(function() {
      var customColor = $(this).attr("data-color");
        $(this).attr('style',"background: "+customColor+";");
      });
    
    })();
    Ответ написан
    Комментировать
  • Как сделать выбор чекбокса?

    Libiros
    @Libiros
    Frontend developer
    У вас вся функция работает при клике на блок с классом news.
    Каждый клик - это класс news, она запускается заново, а в конце выдает false.

    Я бы повесил событие на h3 и сделал бы так:
    var upDownElem = $('.news_info');
    Ответ написан