Задать вопрос
  • Как заставить transition работать?

    Ronnie_Gardocki
    @Ronnie_Gardocki
    Я у мамы фронтендщик.
    1) Не стоит точка с запятой после min-width: 300px, это даже тостер подсвечивает.
    2) Нет такого изинга easy-out, есть ease-out.
    Ответ написан
    6 комментариев
  • Стоит ли указывать в резюме учебные работы (сайт на Symfony 2)?

    Ronnie_Gardocki
    @Ronnie_Gardocki
    Я у мамы фронтендщик.
    Можно и нужно. У меня вообще все портфолио это демки сделанные перед сном от нефиг делать. Начинал естественно с рандомного бреда, который просто обитал в моей голове, но потом со временем вырос до реализации вполне крутых концептов. О реальных проектах 95% клиентов даже никогда и не спрашивали. Естественно лучше заодно все еще на гитхаб какой-нибудь выкладывайте, чтобы код сразу могли оценить.
    Ответ написан
    Комментировать
  • Как лучше брать оплату за работу (фикс за объем / фикс за время / почасовая)?

    Ronnie_Gardocki
    @Ronnie_Gardocki
    Я у мамы фронтендщик.
    Если речь идет о мелочевке (<5-10 часов), то можно договариваться на фикс (ставка*часы), чтобы заказчик был рад. Все что больше этой планки - почасовая. Даже если вам имеют мозги и просят дать все возможные эстимейты, все равно в конце вы должны работать по почасовой ставке. А то часто бывает так, что насчитаешь на 30 часов, например, а клиент потом тут с анимацией поиграет, там еще с чем то тебе мозги вынесет, и хоп, уже 40+ часов наработано. А с работой по рейту можно выполнять любые хотелки клиента с максимальным качеством, не понижая свою боевую мораль и не скатываясь к теркам из-за того что вы хотите больше денег, которые клиент давать не хочет, ибо бюджет был оговорен ранее!
    Ну и естественно для того чтобы нормально работать с почасовым рейтом нужно быть явно круче большинства легкодоступных "специалистов" на фрилансе. Я вот, например, даже никогда софт для учета потраченного времени не юзал. Веду примитивный учет в заметках evernote (а иногда вообще тупо в голове примерные цифры, если они меньше 10 часов) и ни один заказчик еще никогда даже не пытался сопротивляться, когда я называл количество отработанных часов, и спокойно все оплачивал в полной мере.
    Ответ написан
    Комментировать
  • Как с помощью keyframes задать задержку частоты смены кадров?

    Ronnie_Gardocki
    @Ronnie_Gardocki
    Я у мамы фронтендщик.
    designmodo.com/steps-css-animations - все там же в кейфреймах, только юзать steps. Внутри гайда есть примеры с часами и прочими вещами.
    Ответ написан
    Комментировать
  • Можно ли сверстать подобное меню?

    Ronnie_Gardocki
    @Ronnie_Gardocki
    Я у мамы фронтендщик.
    А что тут сложного? Блоки искаженные с помощью transform: skew, внутри них текст/бэкграунд искаженные в обратную сторону с таким же градусом.
    Ответ написан
  • Js-аниматор-звукорежисер - есть такая профессия?

    Ronnie_Gardocki
    @Ronnie_Gardocki
    Я у мамы фронтендщик.
    Это все по идее входит в обязанности UI Engineer (тот же фронтендер по сути, который помимо всяких SPA умеет в красивости).
    На фрилансе подобных тасков много. Ко мне часто обращаются с задачами "превратить видео из After Effects в реальную js анимацию" и "реализовать какую-то крутую фигню, которую тебе дизайнер объяснит с помощью слов и картинок". В профиле найдете мой кодпен, там много всякой всячины, из-за которой ко мне постоянно обращаются люди.
    Ответ написан
    5 комментариев
  • Как можно сделать интерактивную инфографику для сайта с ссылками?

    Ronnie_Gardocki
    @Ronnie_Gardocki
    Я у мамы фронтендщик.
    По виду вам подойдет что-то такое, как минимум попробуйте - https://sarasoueidan.com/tools/circulus/

    Edit: хотя глянул получше, там без допиливания никак, ибо генератор больше под иконки заточен.
    Ответ написан
    1 комментарий
  • Как сделать линию подчеркивания под заголовком и задать ей длину?

    Ronnie_Gardocki
    @Ronnie_Gardocki
    Я у мамы фронтендщик.
    Используйте псевдоэлемент :before/:after с абсолютным позиционированием и извращайтесь с ним как хотите.
    Ответ написан
    Комментировать
  • Как скроллом масштабировать внутри div?

    Ronnie_Gardocki
    @Ronnie_Gardocki
    Я у мамы фронтендщик.
    Плагины 100% есть, гуглите что-то типа javascript/jQuery zoom и так далее. Вот пример - www.elevateweb.co.uk/image-zoom/examples (там внутри есть вариант с колесом).
    Что касается свг, то надо надо зумить с помощью изменения viewBox скорее всего. По плагинам не в курсе что и как.
    Ответ написан
    Комментировать
  • Актуален ли сейчас Yeoman? Или лучше использовать что-то поновее, напр. Webpack?

    Ronnie_Gardocki
    @Ronnie_Gardocki
    Я у мамы фронтендщик.
    Актуален ли сейчас Yeoman? Или лучше использовать что-то поновее, напр. Webpack?


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

    Ronnie_Gardocki
    @Ronnie_Gardocki
    Я у мамы фронтендщик.
    Жуть, кнопка из 2010 года по ходу пришла.
    Если попытаетесь сделать такое с помощью градиентов, псевдоэлементов и прочих подобных вещей, и принимать её при этом будет глазастый дизайнер, то вы сойдете с ума, я вам гарантирую это. Так что проще сделать её картинкой (без цифры само собой).
    Ответ написан
    Комментировать
  • Возможно ли совместить transform (без анимации) с анимацией?

    Ronnie_Gardocki
    @Ronnie_Gardocki
    Я у мамы фронтендщик.
    У вас известна высота элемента, дак зачем вы пытаетесь его центровать с помощью translateY(-50%)? Юзайте отрицательный margin-top на половину высоты элемента и все. Вообще центровка элементов с помощью трансформаций это крайне ненадежная штука, ибо на нечетных значениях получится фигня из-за полпиксельного рендеринга.
    Ответ написан
    Комментировать
  • Легкий, проверенный, семантичный способ сделать действия открытия выбора файлов?

    Ronnie_Gardocki
    @Ronnie_Gardocki
    Я у мамы фронтендщик.
    <label>
      %любой контент, будь то текст или всякие иконки%
      <input type="file"/>
    </label>


    Вас ведь это интересует?
    Ответ написан
    Комментировать
  • Как сократить такую jquery запись?

    Ronnie_Gardocki
    @Ronnie_Gardocki
    Я у мамы фронтендщик.
    Какие-то извращения люди предлагают, страшно жить в таком мире.
    Есть 2 варианта:
    1) CSS :hover - этот самый адекватный.
    2) Если вы извращаетесь и вам надо именно на js, то убираете нафиг все убогие id у элементов, пишите нормальные классы, и к элементам, при наведении на которое должна срабатывать анимация, добавляете атрибуты data-id="*" где * это номер элемента (любым циклом можно такой html вывести).
    Финальный код будет выглядеть так:
    $(document).on("click", ".wpu", function() {
      var id = $(this).data("id");
      $(".epu-"+id).toggle();
    });
    Ответ написан
    1 комментарий
  • Стоит ли уходить с работы?

    Ronnie_Gardocki
    @Ronnie_Gardocki
    Я у мамы фронтендщик.
    Как уже написал другой человек - сидите на работе, пока не найдете альтернативы. Безвыходных ситуаций не бывает. Ищите по удаленке, ищите фриланс, просто ищите как угодно. Когда дело доходит до горящей ситуации, внезапно выясняется что искать новую работу намного проще, чем казалось, пока вы сидели на пригретом месте.
    Ответ написан
    Комментировать
  • Как сократить код в одну функцию?

    Ronnie_Gardocki
    @Ronnie_Gardocki
    Я у мамы фронтендщик.
    Убираешь нафиг txt-1/txt-2/txt-n классы у элементов, вместо этого добавляешь им дата-аттрибуты с айдишниками. Аля data-id="2". Через делегирование вешаешь один обработчик на все .txt элементы. Внутри получаешь их id из атрибута, затем у активного элемента убираешь active-класс, текущему (кликнутуму) его добавляешь, затем прячешь все .img (тут на самом деле тоже лучше поменять с hide/fadein на классы, но это уже не моя проблема) и показываешь нужный с помощью полученного ранее id.
    $(document).on("click", ".txt", function(e) {
      e.preventDefault();
    
      var id = $(this).data("id");
    
      $(".txt.txt-active").removeClass("txt-active");
      $(this).addClass("txt-active");
      $(".pull-right .img").hide();
      $(".pull-right .img-"+id).fadeIn();
    });
    Ответ написан
    Комментировать
  • Как создать логотип с анимацией как тут http://craftedbygc.com/? Есть ли плагин?

    Ronnie_Gardocki
    @Ronnie_Gardocki
    Я у мамы фронтендщик.
    У них самопальный логотип на канвасе. JS минимизированный, так что посмотреть как сделано у них не получится.
    Учите канвас, тогда поймете как такое делать.
    Ответ написан
    Комментировать
  • Сколько принес Ваш open-source проект?

    Ronnie_Gardocki
    @Ronnie_Gardocki
    Я у мамы фронтендщик.
    Думать о донате это гиблое дело.
    Если очень сильно интересует отдача от опенсорса, то задумываться надо об имиджевой отдаче и подобных вещах. То бишь +известность/крутость/скилл. Хочешь сделать какую-то либу, которая теоретически будет конкурентноспособна - пили. Потом на собеседовании в сферический гугл зачтется.
    Ответ написан
    2 комментария
  • Где можно попрактиковаться с svg?

    Ronnie_Gardocki
    @Ronnie_Gardocki
    Я у мамы фронтендщик.
    Идете сюда - tutorials.jenkov.com/svg/index.html
    Наугад изучаете и тут же что-то делаете. В свг очень важно научиться писать все эти координаты "ручками". То есть не ждать какого-то сферического экспорта из иллюстратора от дизайнера, а сидеть и по фану что-то делать. Причем ставку надо делать на path (tutorials.jenkov.com/svg/path-element.html) элемент, потому-что с помощью него в свг можно сделать что угодно и потом это дело анимировать. Вначале освойте базовые формы, потом разберитесь как юзать всякие Q/C/a элементы. Затем попробуйте это дело анимировать без специальных либ (то бишь велосипедирование с помощью rAF). Это безусловно не особо быстрый путь, но зато прокачаетесь огого как.
    Я вначале года начал изучать таким способом. Помню как несколько дней бился головой о стену, пытаясь понять как грамотно юзать arc элемент, в итоге получилась такая простенькая демка - codepen.io/suez/pen/vEgZba
    Потом пошло поехало, 5 дней назад вот эту запилил, где все куда интереснее - codepen.io/suez/pen/epgZjK
    codepen.io/search/pens/?limit=suez&page=1&q=svg - вот вроде как все svg демки, можете по дате отсортировать и идти от начала к концу, изучая внутренности. Там конечно много рандомного говнокода и я комментировал только особенно интересные демки, но все же лучше чем ничего.
    Ответ написан
    Комментировать
  • Есть ли на Upwork работа по дизайну сайтов без верстки?

    Ronnie_Gardocki
    @Ronnie_Gardocki
    Я у мамы фронтендщик.
    Это реально, только вам надо ориентироваться не на бомжей, а на тех кто готов будет платить дизайнеру нормальные деньги за много часов работы. Но для этого естественно надо иметь хорошее портфолио/отзывы.
    Я фронтендер на фрилансе, все сайты что я пилил, были сделаны на основе stand-alone дизайна. В большинстве случаев у меня даже не было прямого доступа к дизайнеру. То есть люди вначале ищут дизайнера, пилят с ним что-то в течении нескольких месяцев, и только потом приступают к созданию сайта, периодически обращаясь за доработками/изменениями к дезигнеру.
    Ответ написан
    Комментировать