Задать вопрос

Pulychuk

Лайки

  • Как сделать задержку в цикле for in в jQuery?

    kshshe
    @kshshe
    Frontend developer
    Так? Поменял ваш пример

    Можно обернуть всю работу в асинхронную функцию, тогда вам будет доступна удобная работа с асинхронностью. 
    // Где-то выше
const delay = (ms) => new Promise((resolve) => {
	setTimeout(resolve, ms);
});

// Это уже в асинхронной функции
/*
   Можно вызвать в любом месте в асинхронной функции, тогда код, условно, 
   остановится там на 1000 миллисекунд и продолжится, когда Promise из delay зарезолвится
*/
await delay(1000);


    Вот именно ваш случай:
    const delay = (ms) => new Promise((resolve) => {
	setTimeout(resolve, ms);
});

(async () => {
  for (var key in contact) {
    var obj = contact[key];
    for (var prop in obj) {
      $('[name="'+prop+'"]').val(obj[prop]);
      console.log(key + " " + obj[prop]);
    }  			
    await delay(1000);
  }
})()
    Ответ написан
    2 комментария
    2 комментария

  • Как сделать перерасчет при активных радио кнопках?

    0xD34F
    @0xD34F Куратор тега JavaScript
    Создаёте функцию расчёта полной суммы, с учётом всех условий, и назначаете её в качестве обработчиков событий всем элементам, от значений которых сумма зависит. Так будет гораздо проще и короче, чем то, что у вас есть сейчас:

    function recalc() {
  const register = +$('[name="radio-register"]:checked').data('value');

  $('#price_result, #price1').text(register
    ? register +
      +$('#count-class option:selected').data('value') +
      +$('[name="radio-znak"]:checked').data('value')
    : 0
  );
}

$('input[name="radio-znak"], input[name="radio-register"], #count-class').change(recalc);
recalc();
    Ответ написан
    3 комментария
    3 комментария

  • Какую библиотеку можно использовать для анимации SVG?

    @SergeiB
    GSAP или Anime.js отлично подойдут для таких целей.
    Ответ написан
    Комментировать
    Комментировать

  • Какую библиотеку можно использовать для анимации SVG?

    Akira9
    @Akira9
    Raphael довольно старый, у Дмитрия Барановского есть новая библиотека: snapsvg.io/about
    Но SVG в img, скорее всего, не анимирует ни одна библиотека, т.к. внутри img на SVG действуют только стили, прописанные внутри тега svg, и его не удастся затаргетить через img:hover.

    Если не секрет, почему именно img? Если включить напрямую как svg, можно обойтись без целой отдельной библиотеки. Можно написать анимацию на ванильном CSS для path в иконке. Например, если <svg class="icon">:
    .icon path {
  stroke-dasharray: 123123;
  stroke-dashoffset: 123123;
  animation: draw forwards;
}

@keyframes draw {
  to {
    stroke-dashoffset: 0;
  }
}


    Вместо 123123 можно подобрать длину методом проб и ошибок, а можно измерить и задать через JS:

    const path = Array.from(document.querySelectorAll(".icon path"));

let length = 0;

const ls = path.map(p => {
  length = p.getTotalLength();
  p.style.strokeDasharray = length;
  p.style.strokeDashoffset = length;
  return length;
});


    Пример (где много лишнего:)) - https://codepen.io/penumbra1/pen/jaQqBb
    Ответ написан
    1 комментарий
    1 комментарий