Еще одна аху#### анимация на CSS и SVG

Поделиться
HTML-код
  • Опубликовано: 16 окт 2024

Комментарии • 91

  • @jaloliddinhaqnazarov2667
    @jaloliddinhaqnazarov2667 2 года назад +3

    Анна огромный спасибо вам меня очень помог ваше видео github pages .

  • @youtubenow2575
    @youtubenow2575 2 года назад +3

    Все такие нежные, бть (с) Жванецкий, Рассказ подрывника :)

  • @EuroDJ
    @EuroDJ 2 года назад

    У меня что-то символы некоторые зашифрованы в названии... какую надо поставить кодировку? ))))

  • @zakarhappy5496
    @zakarhappy5496 2 года назад +2

    И еще один годный годный видос) Контент супер, продолжай в том же духе

  • @golovin.n
    @golovin.n 2 года назад

    Анечка красавица, спасибо за контент

  • @ДокторнаПриколе
    @ДокторнаПриколе 2 года назад +2

    Спасибо

  • @nickf1430
    @nickf1430 2 года назад

    А в css есть условные операторы, чтоб не время подгонять, а по завершении одной линии сразу рисовалась следующая?

    • @mirislamus
      @mirislamus 2 года назад

      Такого там нет. Js нужно для этого использовать

  • @leem0ne
    @leem0ne Год назад +1

    Надо не делей подбирать, а оффсеты точнее подбирать. Из-за того что оффсеты неправильно подобраны, они продолжают анимироваться за пределами path. Отсюда и задержка. А движок время везде одинаково считает. Не может же он в первой анимации одни 5 секунд считать, а во второй другие 5 секунд.

    • @leem0ne
      @leem0ne Год назад

      @@AEF23C20 в свг ничего вы не посчитаете, там длины не указаны. Если знаете геометрию и есть время считать, то считайте. Но быстрее подобрать цифры.
      А делей не надо высчитывать, он точно такой же, как длина анимации предыдущего отрезка.

    • @leem0ne
      @leem0ne Год назад

      @@AEF23C20 нет, тут время анимации задаётся, а не скорость. 10 см будут анимироваться 5секунд, а второй начнется через 5 секунд. И совершенно неважна длина обоих отрезков. Так что ничего считать не надо.

    • @leem0ne
      @leem0ne Год назад

      @@AEF23C20 никто не заметит разную скорость, если подобрать цифры, это самый простой способ. Подобрать и рассчитать скорость. Формулу скорости, думаю, каждый со школы помнит.
      А если надо точно, то проще найти программу, которая высчитывает длину кривой

    • @leem0ne
      @leem0ne Год назад

      @@AEF23C20 я выше писал, если хотите считайте, я лишь написал, что это проще. Высчитывание длины кривой для анимации, это не то, чем бы я хотел заниматься. Есть более интересные задачи. А вы дерзайте. За столько времени могли бы уже формулу скинуть

    • @leem0ne
      @leem0ne Год назад

      @@AEF23C20 зачем мне формула, когда проще подобрать три цифры.

  • @ЗакирПулатов-ы8д
    @ЗакирПулатов-ы8д Год назад +1

    Зачем писать 3 разных кейфрейма с одинаковым свойством?) Зачем гадать длину, если с помощью js можно вытащить точное значение? Зачем гадать задержку между анимациями, если в delay должна быть указана сумма длительностей предыдущих анимаций?

    • @googoogle
      @googoogle 6 месяцев назад

      не для тебя же гения ролик

  • @konion
    @konion 8 месяцев назад

    Web разработка методом тыка 🧐

  • @roman.r.6102
    @roman.r.6102 Год назад

    Кто шарит подскажите, а возможно ли отрисовывать не линии а формы и можно ли вставлять градиенты в stroke

  • @Alexey-Yoshimitsu
    @Alexey-Yoshimitsu 2 года назад +1

    блин, тугалов опять осеменил норм бабу и она ведет аху уроки, лол

  • @galinahappy6919
    @galinahappy6919 Год назад

    Спасибо за твой труд.

  • @trawalex1763
    @trawalex1763 2 года назад

    Умничка.

  • @yurok1991
    @yurok1991 2 года назад +4

    Спасибо за видео! Попробую тоже линию нарисовать, но в фигме, а то планшета нет. Название крутое, не обращай ни на кого внимания!!!!

    • @Gazovchik
      @Gazovchik 2 года назад

      НЕадэкватто

    • @Gazovchik
      @Gazovchik 2 года назад

      Да ещё и Великое

    • @Gazovchik
      @Gazovchik 2 года назад +1

      И с
      Величественным.......
      просто
      "словарным" запасом
      ,,,,,,,

    • @umnyicoder
      @umnyicoder 2 года назад

      @@Gazovchik ты просто гей братан

    • @Gazovchik
      @Gazovchik 2 года назад +1

      @@umnyicoder ,
      Как ты там говорило....
      -
      Газовщик.
      Но с тобой знакомиться мне - своё достоинство Марать.

  • @АлександрКирьянов-з9щ

    А не проще цветные переходы забить в самом svg файле. Зачем этот лишний огород

    • @annblok_webdev
      @annblok_webdev  2 года назад +1

      Тут тоже один , но несколько . При разделении цвета в любом случае будут разные теги.

  • @ConstantineKa
    @ConstantineKa 2 года назад

    Я всё равно не понимаю, объясните! Зачем несколько раз писать один и тот же кейфрейм, но с разными именами?

    • @annblok_webdev
      @annblok_webdev  2 года назад

      @keyframes привязывается к animation-name, а у нас их в примере 3, поэтому их тоже 3

    • @arthurshaidullin7981
      @arthurshaidullin7981 Год назад +1

      @@annblok_webdev Он имел ввиду то, что можно было использовать везде один кейфрейм, а длительность/задержку/плавность уже задавать у классов .one, .two, .three

  • @cafedead
    @cafedead 2 года назад

    Смотрю вот на это, и думаю... Хрень полнейшая и эта анимация, и все то, куда скатились и html, и css, и все прочее, связанное с вебом... Включая браузеры. ) Угадывать эти цифры в стилях - такое себе решение, либо нормального решения мы здесь не увидели, либо его в принципе не существует... Подгонять секунды - тоже чушь. Впечатление, что эти стандарты с этими вот всеми свойствами изобретают какие-то далекие от программирования люди, или и вовсе какие-то дети... А так-то за видео спасибо, отчасти познавательно.

    • @СусловРостислав
      @СусловРостислав Год назад +1

      const pathLength = document.querySelector('path.class-name').getTotalLength()
      console.log(pathLength)
      P.S. WEB прекрасен, будь добрее!)❤

  • @arthur_478
    @arthur_478 2 года назад +3

    как некрасиво девушке использовать такие слова, особенно в заголовках.

  • @Юрец-з7к
    @Юрец-з7к 2 года назад +11

    Да, название для видео конечно глупое, без матов нельзя?

    • @AlphaBetSun
      @AlphaBetSun 2 года назад +2

      а где мат?
      "аху####" - это мат?

    • @pm8186
      @pm8186 2 года назад +2

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

    • @Юрец-з7к
      @Юрец-з7к 2 года назад +1

      @@pm8186 да кто такое сказал? Какой интерес может вызвать слово "ахуенная"? Если заменить на "невероятная" "удивительная" "афигенная" и т.д. суть не изменится

    • @pm8186
      @pm8186 2 года назад

      @@Юрец-з7к это на много милее, согласен 🤗

    • @АлександрКирьянов-з9щ
      @АлександрКирьянов-з9щ 2 года назад

      В прошлом видео я уже делал замечание, но она упёртая девочка.

  • @dmitriichet558
    @dmitriichet558 2 года назад +2

    Не стоит использовать для поднятия просмотров такие названия в видео, вообще никак не клеится с вами)

  • @brodyagaPATY
    @brodyagaPATY 2 года назад +2

    Видео полезное, но за название дизлайк… ссори…

  • @inverterification
    @inverterification Год назад

    Бред

  • @Gazovchik
    @Gazovchik 2 года назад

    Отписка

    • @yurok1991
      @yurok1991 2 года назад +3

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

    • @Gazovchik
      @Gazovchik 2 года назад

      @@yurok1991 ,
      НЕадэкватто

    • @Gazovchik
      @Gazovchik 2 года назад +1

      Для того чтобы что-то понимать
      Голова нужна
      "великий" ты юрочек
      Просто совет
      Купи Голову
      где-нибудь на Распродаже

    • @Savina540
      @Savina540 2 года назад +2

      Да иди уже отсюда обиженка

    • @flyeron1981
      @flyeron1981 2 года назад

      Скатертью дорога, семь перьев в задницу и барабан на шею )))

  • @palkan2590
    @palkan2590 2 года назад

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