Ответы пользователя по тегу JavaScript
  • Как сделать список дел с обновляющимся состоянием в localStorage?

    Siteyoda
    @Siteyoda
    frontend-developer
    Используй другую валидацию, чтобы проверить пуст ли инпут: вместо
    if (inputValue.length !== 0) {
       		arr.push({text: inputValue, done: false});
      		localStorage.setItem('taskslist', JSON.stringify(arr));
      }


    Сделай -

    if (!inputValue.length?.trim()) {
       		arr.push({text: inputValue, done: false});
      		localStorage.setItem('taskslist', JSON.stringify(arr));
      }


    Это уберет возможность наставить пробелов и добавить "пустую строку дел"

    Также используй id для todo, можешь взять функцию Math.random() и сделай так

    if (!inputValue.length?.trim()) {
       		arr.push({
                        text: inputValue, 
                        done: false,
                        id: Math.random().toString(),
                    });
      		localStorage.setItem('taskslist', JSON.stringify(arr));
      }


    А потом при клике на список дел в ней проверяй списки дел по айди, и если найдется нужный, меняй у него данные, например изменить условие: выполнен или нет и тд.
    Ответ написан
    4 комментария
  • Какая логика бесконечной повторяющейся карусели?

    Siteyoda
    @Siteyoda
    frontend-developer
    Используется рамка, в которой размещается один элемент карусели (как правило, он является картинкой). Задается свойство overflow: hidden, что скрывает все за пределами границ элемента (то есть элементов, например, восемь, они все восемь существуют, перемещаются вправо и влево при кручении, но отображается только тот, который в этой зоне видимости). Далее элементы, например, если пользователь нажал кнопку 'влево', перемещаются влево и, когда последний элемент доходит и встает в зону отображения блока, в которой мы указали overflow: hidden, создается клон всего слайдера (то есть клон всех элементов в виде такой же строки, который встает сразу за последним элементом оригинального слайдера). После, когда пользователь нажимает кнопку 'влево' оригинальный слайдер смещается влево, а за ним следует клон, первый элемент которого встает на место видимости и впоследствии мы удаляем тот слайдер, который вышел за пределы (он был оригинальным) и также удаляем клон, ставим на его место оригинальный слайдер. Также работает и с логикой кручения вправо).
    Вообще, делая бесконечный слайдер можно сделать переменную, которая будет содержать длину картинки в слайдере и в функции кручения надо увеличивать или уменьшать margin/padding, задав блоку слайдера Position: relative.
    А вообще, посоветую канал на ютубе, там хорошо объясняется интересующий тебя вопрос https://www.youtube.com/watch?v=gBgD9ieCJpE&t=623s...
    Там, правда, только вправо крутит, но додумаешь как надо и влево сделать, я написал тебе основную логику)
    Ответ написан
    Комментировать