CSS3 Анимация Супермена ► Лазер из глаз!

Поділитися
Вставка
  • Опубліковано 18 січ 2025

КОМЕНТАРІ • 207

  • @alexveremiy1180
    @alexveremiy1180 8 років тому +69

    Не знаю как тебя зовут, но блин спасибо. только начинаю учить CSS, ява скрипт, HTML и все остальное для заработка в инете, хоть мне и почти 40, но после аварии сижу дома, и начал учиться работать на ПК(раньше не знал как его включить). Твои уроки это нечто. Давай еще!!!!!

    • @texno5440
      @texno5440 6 років тому +7

      и как твои успехи в 2018?

    • @kingdragon5256
      @kingdragon5256 6 років тому +1

      есть какие нибудь достижения ?

    • @Antoshkiv1
      @Antoshkiv1 6 років тому +5

      тип ты еще жыв?

    • @term8124
      @term8124 5 років тому +2

      Его Абрахам зовут)

    • @serogapicture3731
      @serogapicture3731 5 років тому

      чел мы в тебя верим!

  • @alexc2882
    @alexc2882 8 років тому +49

    Блестяще. 30 минут смотрел не отрываясь, будто 5 минут прошло. Очень вдохновляет на изучение.

    • @HowdyhoNet
      @HowdyhoNet  8 років тому +13

      Рад помочь =)

    • @DerAleksey
      @DerAleksey 2 роки тому

      да реально на одном дыхании

  • @КнижнаяПолка-у1т
    @КнижнаяПолка-у1т 5 років тому

    Все, как обычно супер и содержание и качество. Только для корректного
    отображения левитирующей картинки, ее не нужно прописывать в css в
    background-image, а в html через контейнер и в .

  • @АртёмСальников-ч8й
    @АртёмСальников-ч8й 5 років тому +3

    Ребята у кого не отображается картинка
    1 - проверти путь, у хауди немного не правильно (../img/stance.png) две точки перед слешем
    2 - обязательно пробел в селекторе #hero .stance {}

  • @arTSTyLE1313
    @arTSTyLE1313 7 років тому +1

    Просто гениально. Спасибо большое, что выкладываешь такие интересные уроки!

  • @olegrubinin6349
    @olegrubinin6349 8 років тому

    Я очень увлёкся программированием,но я полный ноль в этом.Инфы много,но трудно для усваивания!Благодаря тебе, начиная с видео Html-за час,всё стало доступно для понимания!ОГРОМНОЕ ТЕБЕ СПАСИБО!!!

  • @МирВсем-г4м
    @МирВсем-г4м 6 років тому

    Абрахам, супер всё! Каждый ролик твой на очень хорошем уровне, всегда ставлю сначала лайк, потом смотрю! :)

  • @konstantin_tertilov
    @konstantin_tertilov 8 років тому +4

    Спасибо, крутое видео, побольше таких, на одном дыхании смотреться, до конца доделал бы, было бы в обще идеально!

  • @НаурызДжакупов-э4ы
    @НаурызДжакупов-э4ы 6 років тому

    Спасибо за уроки! Понятливые и интересные уроки получаються у вас!

  • @АнатолійКазімка
    @АнатолійКазімка 8 років тому +12

    Супер! заслуживает лайка!

    • @maxkit7896
      @maxkit7896 7 років тому +1

      Не только лайка )

  • @charlesbaudelaire7454
    @charlesbaudelaire7454 7 років тому +6

    Ты монстр чувак, я просто в шоке.

  • @russianpoliticalwar
    @russianpoliticalwar 7 років тому

    Дружище спасибо тебе большое за уроки, очень хорошо и интересно подаешь материал, у тебя просто талант!)

  • @nazarsmugi9688
    @nazarsmugi9688 8 років тому +2

    Скажите пожулуйста как называется расширение для просмотра кода цветов?

    • @shubka_h
      @shubka_h 4 роки тому

      ColorZilla, радужная круглая иконка

  • @игорьконторщиков-б5я

    ОГРОМНОЕ СПАСИБО ТОЛКОВЫЙ КОНТЕНТ

  • @gavrsmit1621
    @gavrsmit1621 8 років тому

    Зачет) Побольше таких видосов!

    • @HowdyhoNet
      @HowdyhoNet  8 років тому

      =)

    • @БайрамРамазанов-д5к
      @БайрамРамазанов-д5к 8 років тому

      +Хауди Хо™ - Просто о мире IT! Привет , а ты будешь делать видео по css ?дизайн сайтов

    • @HowdyhoNet
      @HowdyhoNet  8 років тому

      Со временем что-то такое будет.

  • @deathgun5861
    @deathgun5861 7 років тому +1

    хауди бро спс те большое за твои уроки все исправил дело было в одной фигурной скобки)

  • @sagynbekk3852
    @sagynbekk3852 8 років тому +3

    Даа, классное видео. Спасибо.
    Когда сайты создаются через WordPress, Joomla и т.д. они такие моменты пишут отдельным кодом или как?

  • @Vitya952
    @Vitya952 8 років тому

    Абрахам, сделай подобные видео уроки, в которых ты показываешь, как делать такие крутые штуки, преимущественно на JS и jQuery очень интересно, я благодарен тебе за этот ролик!

    • @HowdyhoNet
      @HowdyhoNet  8 років тому +1

      Такие еще будут)

  • @ИльяСаблин-ш7е
    @ИльяСаблин-ш7е 4 роки тому

    Расскажите пожалуйста подробнее как установить и пользоваться GULP... На канале у Вас не смог найти подходящего видео(((

  • @chinese6sniper933
    @chinese6sniper933 8 років тому +6

    Абрахам я зделал как ты зделал в видео но почемуто у меня Hero не показываеся , у меня только белы свет видно и ничего большо.

  • @СергейВидеман-в4э
    @СергейВидеман-в4э 7 років тому +2

    Блин, ты так быстро и круто все делаешь. я тоже так хочу!!!

  • @viacheslavkrotevych7849
    @viacheslavkrotevych7849 4 роки тому

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

  • @alexanderommm
    @alexanderommm 8 років тому

    Все так просто, когда смотришь, видео.... Всем удачи в учении, а Абрахаму - шалом!)

  • @tokiwotomare3303
    @tokiwotomare3303 6 років тому +1

    Ты не преподаёшь случайно платно уроки по html css js и т.д? Хотел бы у тебя поучится:)

  • @peace1791
    @peace1791 8 років тому

    Так сложно... но результат очень радует.Спасибо!

    • @ryner3056
      @ryner3056 8 років тому

      На самом деле, что-то слишком все просто.

  • @ruslan671
    @ruslan671 8 років тому

    каждый раз узнаю все больше и больше

  • @puppetmaster3036
    @puppetmaster3036 7 років тому

    Вопрос не по видео. Подскажи какие у тебя стоят проги на убунту(хотя бы те, что в сайд баре). Ну и если не сложно, то пиши сразу как пишутся для аптитьюда (апт-гета)

  • @Новости2016-й3с
    @Новости2016-й3с 8 років тому

    А какие вы программы запустили в начале !? Не совсем понял, подскажите пожалуйста.

  • @ogogo505
    @ogogo505 7 років тому

    привет. получается у тебя gulp запущен все это время в командной строке?

  • @OmahaTValex
    @OmahaTValex 8 років тому +2

    This is such a great video. You always doing an awesome job!!!! THUMBS UP!!! Great to be friends with you :)
    Happy weekend :-)

  • @qu4nt47
    @qu4nt47 6 років тому

    Абрахам, надеюсь ты прочитаешь... Можешь добавлять где-то готовый код например в том же trinket'е. Просто некоторые моменты не замечешь (ты очень быстро все делаешь) и потом недопонимания. Спасибо!

  • @АнуарбекЗакирьянов

    Анимацию тени легче было через transform:scale() сделать.А так все супер!!! Только для чего мы бэкграундам задавали position:absolute?

  • @secondson4536
    @secondson4536 6 років тому

    Я, конечно, понимаю, что прихожу на этот ролик через полтора года после его публикации, но помоги, Хауди, а?Раньше я работал на винде, там был OpenServer. А в этом ролике ты показываешь, как делаешь анимацию на локальном хосте, но на Ubuntu. Сам я перешёл на неё недавно, и долго искал альтернативу OS. Какую локалку ты используешь на Linux?

  • @rademaxbh
    @rademaxbh 8 років тому

    Хауди Хо, ты лучший!

  • @MrSunbeam
    @MrSunbeam 7 років тому

    Что ты используешь для того, чтобы браузер мгновенно отображал изменения в коде?

  • @azabum12ee
    @azabum12ee 6 років тому +6

    Эх был же годный контент):

  • @okside6911
    @okside6911 7 років тому

    Свойства можно прописывать одной строкой: (name) (duration) (timing-function) (delay) (count) (direction).
    То, что можно было объяснить на пальцах - затянул на пол часа.

    • @HowdyhoNet
      @HowdyhoNet  7 років тому +2

      Урок для новичков.
      Не вижу смысла объяснять что-то знающим как всё это делать.

  • @generousycompany1109
    @generousycompany1109 6 років тому

    простите,я новичок а почему ты разделил 25 на 2 ? я про то что (' -12.5px про Shadow ") т.e откуда ты взял? эти числа

  • @paulkamel2120
    @paulkamel2120 8 років тому +1

    у меня тоже белый прямоугольник, хоть код точь-в-точь переписал. что это может быть?

  • @zerox8622
    @zerox8622 6 років тому

    Скажите пожалуйста как программа называется на которой он пишет код

  • @atom1826
    @atom1826 7 років тому

    Смотришь ваши видео и понимаешь, что создание веб сайтов не сложная задача!

  • @haimlvov10
    @haimlvov10 8 років тому

    Спасибо! Очень понравилось!

  • @ArtyrBlack
    @ArtyrBlack 8 років тому

    А что за текстовый редактор у тебя?

  • @frontendmaster2704
    @frontendmaster2704 8 років тому

    несомненно лайк) но упустили один момент: при атаке, персонаж не сразу вверху, а постепенно поднимается и только после делает лазер

    • @amazing65
      @amazing65 8 років тому

      Он же говорил про это

    • @ryner3056
      @ryner3056 8 років тому

      Про это он говорил, а вот замену сканированного текста, забыл.

  • @ArpeksMenethil
    @ArpeksMenethil 8 років тому +3

    А там на сайте при сканировании еще и текст менялся. Как это сделать?

    • @danieldnc3816
      @danieldnc3816 6 років тому

      Arpeks Menetil примени hover

    • @doge8633
      @doge8633 6 років тому

      так же как и с анимацией, только с текстом, меняешь.

  • @EvgeniyGetman-t3u
    @EvgeniyGetman-t3u 6 років тому

    А свойство "animation" разве нельзя сократить, как padding и маргин? Вроде же есть сокращение

  • @ВиталийЗумай
    @ВиталийЗумай 8 років тому

    у меня не работает js переход анимации, не знаешь отчего? Через FireBug проверил, скрипты действительно подключены

  • @chinese6sniper933
    @chinese6sniper933 8 років тому +5

    Можете помочь, я зделал все как надо но у меня чтото рисунок не выходить у меня только белое петно стоит.

    • @mex2669
      @mex2669 7 років тому +1

      у меня тож

    • @mex2669
      @mex2669 7 років тому +1

      хауди помоги, на єто могло повлиять то что я не подключил єтот гульп??

    • @mex2669
      @mex2669 7 років тому

      просто столько кода прописал и всё зря что ли?

    • @alexmercer3807
      @alexmercer3807 7 років тому +2

      prosto skopiruy address kartinki v samom brauzere i vstav
      background-image: url("anti-captcha.com/images/mainpage/herofront_nocape.png");

  • @dreammakmuss
    @dreammakmuss 8 років тому

    Сколько времени нужно кодить, чтобы писать так быстро и, чтобы сельсовет так быстро соображал, что, куда и как написать? :)

    • @muradakhundov3914
      @muradakhundov3914 7 років тому

      Андрей Мануковский в sublime tezt 3 есть горячии клавиши

  • @Новости2016-й3с
    @Новости2016-й3с 8 років тому

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

  • @ArtemArtem-t7t
    @ArtemArtem-t7t 8 років тому +1

    Как ты при помощи знака "!" стандартную структуру HTML?

    • @АртемАртем-п9ч
      @АртемАртем-п9ч 8 років тому

      emmet - плагин, в принципе есть для любых редакторов.

  • @MrAngriYT
    @MrAngriYT 6 років тому

    Каждое видео верстки учусь Топ, больше видосов

  • @АлексейАлексеевич-ч6щ

    сделай видео как баннеры делать

  • @yakiimowald
    @yakiimowald 8 років тому

    Можно ли сделать такой же саблим на винде?
    Можешь сделать видео урок по создание змейки
    где угодно? а лучше в разных средах - это было бы круто.
    C#, Python, Delphi, Java, JS ???

    • @HowdyhoNet
      @HowdyhoNet  8 років тому

      Можно

    • @yakiimowald
      @yakiimowald 8 років тому

      ***** Отлично, тогда скажи КАК? К слову, только что посмотрел видео про НЕТОЛОГИЮ - спасибо!

    • @TheKinoGo
      @TheKinoGo 8 років тому

      Спасибо;)

    • @yakiimowald
      @yakiimowald 8 років тому

      Kinogo.net пожалуйста

  • @alexandrvoevodin5113
    @alexandrvoevodin5113 5 років тому

    столкнулся с такой проблемой, что не грузятся png-шки. Пробовал другие из интернета достать, другие браузеры, хоть бы хны.. Не отображает картинки

  • @AlisherMakhmudov
    @AlisherMakhmudov 8 років тому

    v sublime text ne obyazatelno videlyat' stroku cthobi skopirovat', mojno v lyuboy chasti stroki Ctrl+C, i on skopiruyet stroku

  • @alinuriev4432
    @alinuriev4432 8 років тому

    Сделай видео о том где ты научился программировать и какие учереждения ты советуешь

    • @HowdyhoNet
      @HowdyhoNet  8 років тому +1

      Уже есть. Посмотри видео Как стать программистом Мой опыт Моя история

  • @cedzip
    @cedzip 8 років тому

    Что за редактор у тебя?

  • @wolfrid4542
    @wolfrid4542 4 роки тому

    Капец, магия👍

  • @The-Digital-Mind
    @The-Digital-Mind 6 років тому

    На оригинальном сайте надпись сделана картинкой и манипуляции производятся с картинкой,
    а не с текстом, что несколько усложняет реализацию делая её более интересной

  • @Mika43344
    @Mika43344 6 років тому

    про gulp файл кто-нибудь может подскахзать? (автообновление по изменению css) ???

  • @ВалентинРубин
    @ВалентинРубин 8 років тому

    Круто! Красава!

  • @АлександрПелевин-х4ф

    Блин, вот знаете, ещё вчера я бы ничего здесь н епонял, но достаточно пару часиков поучить html и уже что-то я понимаю даже тут.

  • @kickbyblow
    @kickbyblow 8 років тому

    побольше таких видео)

  • @ЕгорНей-л3ф
    @ЕгорНей-л3ф 7 років тому

    Хауди !! Прошу тебя скажи мне что за редактор кода???

  • @AlisherMakhmudov
    @AlisherMakhmudov 8 років тому

    razve defer delayet zagruzku bistreye?

  • @pixel2372
    @pixel2372 7 років тому

    Плиз подскажите как прогга в которой он писал называется!

  • @malimonserghei201
    @malimonserghei201 7 років тому

    у меня не появляется фото png.. хочу поставить другого персонажа, а он не появляеться.
    почему?

  • @PromptModeller
    @PromptModeller 6 років тому

    вылезает ошибка и не открывает кариинку
    Ошибка: Failed to load resource: net::ERR_NAME_NOT_RESOLVED

  • @exem3017
    @exem3017 6 років тому

    Как у него сами атрибуты в html заменяются?

  • @TheRipWay
    @TheRipWay 8 років тому

    Спасибо, интересно!

  • @dmitry.gashko
    @dmitry.gashko 8 років тому

    Полезное видео!))

  • @mra-f3x
    @mra-f3x 8 років тому

    Это макбук? я просто дизайна такого не видел, а папку виндовс заметил

    • @HowdyhoNet
      @HowdyhoNet  8 років тому +1

      Это Linux Ubuntu =)

  • @alexey731
    @alexey731 8 років тому

    Отличное видео спасибо большое! Только у меня png картинки так и не появляются после свойств absolute. Уже не знаю что делал пути проверил все правильно, код 1 в 1

    • @alexey731
      @alexey731 8 років тому

      как будто бы неправильный путь к img

    • @HowdyhoNet
      @HowdyhoNet  8 років тому

      Может и не правильно. На какой ты ОС?

    • @alexey731
      @alexey731 8 років тому

      png появились только после того как я прописал полный путь url(file:///Users/Desktop/lazer/images/stance.png);

    • @alexey731
      @alexey731 8 років тому

      ***** на Mac

  • @constantineshibaev6772
    @constantineshibaev6772 8 років тому

    Почему "гульп" ? Почему не "галп" ?
    Для ребят ниже в комментах:
    - где вы увидели макбук? это OS Linux Ubuntu.
    - Текстовый редактор Sublime Text написано же слева вверху.

  • @aqua-t6l
    @aqua-t6l 5 років тому

    гульпом убил просто))

  • @Minazavr
    @Minazavr 8 років тому +26

    Меня всегда мучал вопрос, почему какашка символ канала?

    • @HowdyhoNet
      @HowdyhoNet  8 років тому +11

      Прямо мучал?

    • @kickbyblow
      @kickbyblow 8 років тому +17

      это не какашка это Снеговик из Нигерии

    • @темирланТулеубаев-ж5н
      @темирланТулеубаев-ж5н 8 років тому +2

      Ты южный парк не смотрел?

    • @dmitry-utkin
      @dmitry-utkin 8 років тому +7

      Потому что говнокодинг

    • @I-am-lapi
      @I-am-lapi 8 років тому +2

      Я думала, это муровей(;

  • @iex32
    @iex32 8 років тому

    Один вопрос... Зачем?

  • @ItIsApachee
    @ItIsApachee 8 років тому

    Ты живешь в Узбекистане?

    • @HowdyhoNet
      @HowdyhoNet  8 років тому

      Да

    • @murd1337
      @murd1337 8 років тому

      так и знал.Так как : когда ты снимал урок по PHP регистрации,там где-то в середине твой комп подключился к вай-фаю,где название начинается с "Uzb".=D

    • @ItIsApachee
      @ItIsApachee 8 років тому

      ***** Я тоже раньше там жил,сейчас в Москве учусь в школе. Иногда приезжаю.

    • @HowdyhoNet
      @HowdyhoNet  8 років тому

      =)

  • @postelb8046
    @postelb8046 6 років тому

    В JS знак доллара?

  • @КонстантинСукинСан

    Круто)

  • @eugenesidelnyk4600
    @eugenesidelnyk4600 6 років тому

    Гульп?

  • @яншинкарук
    @яншинкарук 8 років тому

    Код скиньте пожалуйста

  • @maxsutka4500
    @maxsutka4500 8 років тому +1

    Как называется сайт бар ?

  • @nikalastsk6275
    @nikalastsk6275 8 років тому

    больше таких видео !!!!!!!!

  • @hivelinwasted6568
    @hivelinwasted6568 5 років тому

    мне кажеться слишком сного возни с тенью, всё можно было сделать с помощью transform:scale()

  • @poseidon9164
    @poseidon9164 6 років тому

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

  • @danieldnc3816
    @danieldnc3816 6 років тому

    Ля у меня не работает вообще js не сканирует ничего просто стоит в idle (стойка) и нечего не делает зделал все как надо точь в точь...

  • @100HalalChannel
    @100HalalChannel 6 років тому

    У меня почему через некоторое время тень пропала

  • @darkgame2106
    @darkgame2106 5 років тому

    оу май это видео как 5 минут

  • @deathgun5861
    @deathgun5861 7 років тому +1

    все сделал также но анимация не пашет((

  • @ГрафШувалов-й3о
    @ГрафШувалов-й3о 8 років тому

    А что за совтина? Ты пишешь див#название и она атоматически прописывает див. В пхп шторм можно также настроить?

  • @muhammadxojarustamxojayev7678
    @muhammadxojarustamxojayev7678 4 роки тому

    Гул да, 😂😂😂 место галпа

  • @ВладимирПутин-е8е
    @ВладимирПутин-е8е 8 років тому

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

  • @almaz6248
    @almaz6248 6 років тому

    Perfect lesson, boy💥💥💥

  • @aleksandrmannawardz2415
    @aleksandrmannawardz2415 7 років тому

    Я бы это пол года писал)

  • @mx1xmx
    @mx1xmx 8 років тому

    Хауди, сверстай шаблон на видео пожалуйста.

  • @doctornegativ4872
    @doctornegativ4872 4 роки тому

    CSS3 Анимация Мудакмена ► Лазер из глаз!

  • @Системныйадминистратор-ю2х

    бля как это можно все запомнить, весь синтаксис, как должно идти еще и слова аааааааааааа, и это еще css, самое легкое

  • @kitnaumov9441
    @kitnaumov9441 3 роки тому +1

    Поч убунта? Поч не кали?