Уроки jQuery практика- анимация счетчика чисел

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

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

  • @plajboi3608
    @plajboi3608 7 лет назад +33

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

  • @HlibShmatkov
    @HlibShmatkov 7 лет назад

    Большое спасибо!
    Я только сегодня задумался, как такое сделать, а тут вы со своим видео! :)

  • @renkodev
    @renkodev 5 лет назад

    чел, спасибо за твои видео! ты очень хорошо объясняешь
    для меня это просто алмазный материал) спасибо!

  • @ИльяАксаков
    @ИльяАксаков 4 года назад +2

    Класс. но не плохо было бы еще оставлять ссылку на кодпэн)

  • @viktorshcheplyagin9576
    @viktorshcheplyagin9576 7 лет назад +1

    по поводу .prop('Counter', 0) : 'Counter' это что-то вроде "заглушки", чтобы было во что поместить стартовое значение, которое будет меняться, и ни на что больше не повлиять (потому-то и нужно "несуществующее" свойство). Типа переменной с начальным значением (в нашем случае 0)
    П.С. Поправьте, если ошибаюсь

  • @ИванИванов-е5л4р
    @ИванИванов-е5л4р 7 лет назад

    Ставлю лайки. Отличный формат. Интересен как jQuery, так и ReactJS.

    • @SuprunAlexey
      @SuprunAlexey  7 лет назад

      Спасибо вам, будем практиковать и далее

  • @ВатквизДеСад
    @ВатквизДеСад 6 лет назад +3

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

  • @AdgarAllan
    @AdgarAllan 4 года назад +1

    Всё конечно классно..
    Хотелось бы увидеть что бы данный код запускался при попадении на блок . Что то типо delay()

  • @Milliarderful
    @Milliarderful 7 лет назад +11

    Откуда взялось значение Counter в prop

    • @sunvodoley
      @sunvodoley 6 лет назад

      2:03 это класс блока

  • @munisaashurova2542
    @munisaashurova2542 6 лет назад

    Thank you very much

  • @Elator11777
    @Elator11777 7 лет назад +1

    Спасибо. Ждем уроки по бутстрап 4 - желательно верстка реального проекта. Вопрос по уроку, зачем блокам надо было задавать position: relative? Без этого нельзя? я пытаюсь понять, зачем-)

    • @SuprunAlexey
      @SuprunAlexey  7 лет назад

      Может я переделывал код, не помню, потом пересмотрю отвечу

    • @Elator11777
      @Elator11777 7 лет назад

      4:28 - здесь например

  • @Град-ь2щ
    @Град-ь2щ 6 лет назад

    этот парень красавчик

  • @CaHe4ek_
    @CaHe4ek_ 7 лет назад +2

    Писать inline-block, а затем float:left, ты же в курсе что после float, элементы становятся блочными? зачем тогда inline-block?

  • @Dmitrysib85
    @Dmitrysib85 5 лет назад +1

    "Мы будем изменять Counter у этого элемента и его текстовое значение" Как это возможно вообще понять? :) Такое ощущение, что просто бездумно откуда-то скопировали. В данном случае мы с помощью prop добавляем элементу свойство с неудачно выбранным именем Counter (никак не связано с классами) и присваиваем ему 0. Потом с помощью animate указываем что будем менять его до значения, которое берем из html у счетчика из его текстового поля. И самое главное - функция step позволяет менять значение поля объекта (в нашем случае count.text) до того как оно "установится". А math.ceil - это тупо округление в большую сторону

    • @ДенисМ-о4м
      @ДенисМ-о4м 4 года назад

      Так а какой смысл вообще в этом свойстве, если, например, передавая в метод .animate({ anyValue: $(this).text() }), код все равно будет работать? Т.е. в методе .prop() может быть совершенно любая строка (например, 'test35') и в .animate что угодно (например, тот же anyValue), и все код работает точно так же.

  • @maxz8911
    @maxz8911 5 лет назад

    Здравствуйте. Я не могу понять, что за параметр "now" и что он передает? Заранее спасибо за пояснение

  • @SuperGameAR
    @SuperGameAR 7 лет назад +12

    Что за Counter в prop ?

    • @Град-ь2щ
      @Град-ь2щ 6 лет назад +6

      Ararat Ghazaryan counter-strike

    • @sunvodoley
      @sunvodoley 6 лет назад

      2:03 это класс блока

    • @МалюкАлександр-п2м
      @МалюкАлександр-п2м 6 лет назад +1

      там регистр первой буквы разный, через то и столку людей сбило

    • @KInoShKa682
      @KInoShKa682 6 лет назад

      этот родительский эелемент

    • @damir_tok
      @damir_tok 5 лет назад

      Название свойства, можно выборать любое

  • @butcherfirewaters
    @butcherfirewaters 7 лет назад

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

  • @TheManblax
    @TheManblax 7 лет назад

    1. Почему не используешь ctrl + c и ctrl + v чтобы не ошибаться в названиях классов?
    2. Зачем писать неиспользуемые свойства, в частности *position: relative* ?

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

    Как на ванниле это сделать ?

  • @__-qk1jr
    @__-qk1jr 4 года назад

    помарочка, там должна быть строка: Counter:Counter=$(this).text()
    В ином случае с небольшой вероятностью произойдет баг. Кстати версия jquery не должна быть slim, работать тоже не будет.
    Надеюсь кому да помог

  • @shamilsalakhutdinov5519
    @shamilsalakhutdinov5519 4 года назад +1

    всегда так интересно, когда код идентичный, но ничего не работает))

  • @АндрейТретьяк-е7х
    @АндрейТретьяк-е7х 4 года назад

    Скажите пожалуйста а как можно разделить большие числа на разряды? Ну т.е. чтобы выводилось не так 1000000 а вот так 1 000 000?

    • @SuprunAlexey
      @SuprunAlexey  4 года назад

      С помощью регулярных выражений

  • @neofit3157
    @neofit3157 7 лет назад +1

    офигенно, после такого объяснения все кажется просто / у меня вопрос, может не по теме но: Angular / React / Vue - что лучше изучить, мне кажется по Vue документация лучше и структуирование, какие мнения ?

    • @SuprunAlexey
      @SuprunAlexey  7 лет назад

      Спасибо! У каждого свои плюсы и минусы и нюансы. Так и не скажешь)

    • @span4ev
      @span4ev 6 лет назад

      React. Больше катируется

  • @romannovak375
    @romannovak375 6 лет назад

    super thx

  • @HackerOsaulenko
    @HackerOsaulenko 7 лет назад +1

    Ты прописал .wrapper что ты жмёшь что бы появился код?
    Заранее спасибо!)

  • @АндрейПерминов-ю6э

    Один из самых лучших каналов, спасибо за Ваш труд!)

    • @SuprunAlexey
      @SuprunAlexey  7 лет назад

      И вам спасибо что смотрите!

  • @PacoOfficial
    @PacoOfficial 7 лет назад +1

    норм, видел ещё плагин подобный

    • @SuprunAlexey
      @SuprunAlexey  7 лет назад

      Плагины уже написаны переписаны, тут суть в практике

  • @andrii_kyslov
    @andrii_kyslov 7 лет назад

    Здравствуй, хотелось бы побольше практики в jquery по методу prop.

    • @SuprunAlexey
      @SuprunAlexey  7 лет назад

      Хорошо, что будем делать? Слайдеры? Модальные окна?

    • @andrii_kyslov
      @andrii_kyslov 7 лет назад

      Web Developer Blog , а лучше и то и другое), но сначала хотелось бы увидеть слайдер.

  • @eugene_rn
    @eugene_rn 7 лет назад

    Снимите про свой мак обзор, пожалуйста) Вы обещали)

    • @SuprunAlexey
      @SuprunAlexey  7 лет назад

      Да, точно, надо снять.Спасибо что напомнили)

    • @eugene_rn
      @eugene_rn 7 лет назад

      Есть желание купить pro 13 и хочется услышать мнение человека, работающего на маке. (Удобно / не удобно, в частности размер экрана), именно для web разработки

    • @2011radj
      @2011radj 7 лет назад

      Как сделать чтоб анимация срабатывала при скроле до данного блока ?

    • @CoderShadow
      @CoderShadow 7 лет назад +1

      Radj Kerimov, обработать событие window.onScroll (learn.javascript.ru/onscroll). Где в качестве значения использовать $("#div").offset().top, как вариант.

    • @butcherfirewaters
      @butcherfirewaters 7 лет назад +1

      Алексей, а не подскажите, точный код. а то мучаюсь, у меня пока не выходит.

  • @Артур-з4ь9е
    @Артур-з4ь9е 7 лет назад

    Можно ссылку на урок про this не могу найти.

  • @lak0sta369
    @lak0sta369 7 лет назад +1

    Что такое 'Counter' откуда мы его берем?

    • @alexandradreak1441
      @alexandradreak1441 7 лет назад

      Если не ошибаюсь, это одно из свойств метода prop.

    • @majoryt3869
      @majoryt3869 4 года назад +1

      Это class блока 2:03

  • @Дендрай
    @Дендрай 7 лет назад

    генератор крутых видео лайк

  • @mushnikov35
    @mushnikov35 7 лет назад

    привет ! скажи как на js написать на увеличение счетчика цифр, +1 каждую минуту с анимацией по типу спрайтов при увеличении числа, меньшее число уезжает вниз ??? плииззз

    • @SuprunAlexey
      @SuprunAlexey  7 лет назад

      +Евген Пупкин вот мне интересно, вы ожидаете что я сюда решение в коммент пришлю? При том что вы даже не понятно задачу объяснили

    • @mushnikov35
      @mushnikov35 7 лет назад

      окей, увеличение счетчика чисел по возрастанию, но чтоб не числом вывод а картинкой png картинка под каждое число с задержкой в 1 минуту

    • @mushnikov35
      @mushnikov35 7 лет назад

      есть куча счетчиков на .js но они с обратным отчетом и привязаны ко времени

  • @Dmitrysib85
    @Dmitrysib85 5 лет назад +1

    Для просто скопировать и к себе на сайт вставить, конечно, годится.. но объясняете очень плохо. Видео всего 10 минут, из них jQuery - 30 секунд.. увеличьте до 2 минут и попробуйте объяснить что откуда берется (тот же Counter). Видно же по комментариям, что не "итак всем понятно"

  • @serialnagibator2514
    @serialnagibator2514 7 лет назад +1

    по сетке бутстрап 4 когда видосики?) именно практику бы

    • @SuprunAlexey
      @SuprunAlexey  7 лет назад +1

      Хорошо, когда будет время на него

  • @CoderShadow
    @CoderShadow 7 лет назад

    Добавлю: вместо ".end" можно использовать псевдокласс ":last-child". Мы же верстаем по-современному? ;)

    • @kartopla123
      @kartopla123 7 лет назад

      :last-child в IE не будет работать :)

    • @nighthunter28
      @nighthunter28 7 лет назад +2

      ie8 и меньше. ток кому они нужны сейчас.

    • @SuprunAlexey
      @SuprunAlexey  7 лет назад

      увы есть и такие

    • @TheManblax
      @TheManblax 7 лет назад

      Алексей Шадов
      все что ниже IE 11 - пора отправить на свалку.

  • @СашаЛютаев
    @СашаЛютаев 7 лет назад

    привет)) спасибо за урок!)
    можешь здалать видео по табах на js. ?)

    • @SuprunAlexey
      @SuprunAlexey  7 лет назад +1

      Сегодня сделаю про табы на jQuery, а вот на js кстати видео тоже есть

    • @Telonios
      @Telonios 5 лет назад +1

      @@SuprunAlexey я тя обожаю ты блин самый лучший учитель .Другие не делают практику. А что ты там подключал в css.

  • @romanleonidov
    @romanleonidov 6 лет назад +1

    код не работает

  • @Kempriol
    @Kempriol 7 лет назад

    без "в принципе, как-то так" ролик - не ролик :D

  • @dr.rastafarai7548
    @dr.rastafarai7548 7 лет назад

    Привет!
    Годнота.
    Спасибо!
    А как можно сделать что бы накручивались цифры как в игровых автоматах?
    Хочу на сайт с криптовалятой ценник выложит такой.

    • @SuprunAlexey
      @SuprunAlexey  7 лет назад

      Можно конечно , но по другому немного нужно делать)

    • @dr.rastafarai7548
      @dr.rastafarai7548 7 лет назад

      Web Developer Blog сделаешь урок?)

  • @kelevra1493
    @kelevra1493 6 лет назад +1

    Ничерта не понятно.

  • @Anonimus-iz4sc
    @Anonimus-iz4sc 7 лет назад

    Ни хрена не понял file js ((

    • @SuprunAlexey
      @SuprunAlexey  7 лет назад

      Какие именно вопросы?

  • @АлексейПетрович-ц7ъ

    Уроки полное говно. Пацана посадили тупо читать по бумажке. А канал сделан чтобы набить его кучей говнороликов чтобы потом рубить бабло на рекламе.