Задать вопрос
  • Как сделать окно службы поддержки?

    ArsenyMatytsyn
    @ArsenyMatytsyn
    Руководитель frontend направления, предприниматель
    Можно сделать самому, нужен будет только несколько больший спектр языков или настроек сервера.
    И, если приложить достаточно усилий, то можно сделать и полноценный, со статистикой, саджестами, приложениями на телефон. Вот только стоит ли это того? Иной раз стоит.
    Но в большинстве случаев оптимальнее выбрать один из готовых. Следует обратить внимание на то, сколько мусора тащит чат. У нас на поддержке несколько сайтов и мы плотно сталкиваемся с Jivosite и LiveTex. Последний не рекомендую, он тащит тонны мусора (шрифты, доп-скрипты и т.д.).
    Ответ написан
    Комментировать
  • Как сделать линию, показанную на скриншоте?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега CSS
    Руководитель frontend направления, предприниматель
    Можно и так: htmlbook.ru/css/background-repeat
    Да и вообще, вариантов тьма.
    Ответ написан
    Комментировать
  • Как задать ширину колонке в таблице Bootstrap 4?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега CSS
    Руководитель frontend направления, предприниматель
    Класс .table-responsive применяется не к самой таблице, а к обертке. Например div.
    А чтобы задать размер, нужно задать, собственно, размер. Атрибут width приведет к невалидности кода, поэтому либо стилями, либо js на лету.
    Ну а запрет переносов делает верстке чаще всего больно.
    Ответ написан
  • Как прописать для двух псевдоэлементов одни и те же свойства (SASS)?

    ArsenyMatytsyn
    @ArsenyMatytsyn
    Руководитель frontend направления, предприниматель
    SASS это не более, чем расширение CSS. В нем работает все то же самое, но есть крутые фичи, типа призрачных классов. К запросу «кратко записать» оно мало относится, а вот «прописать одни и те же свойства» это на здоровье.
    Ответ написан
    Комментировать
  • Стоит ли на моём этапе изучения приступать к js?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега CSS
    Руководитель frontend направления, предприниматель
    JS для верстки учить надо обязательно. Хотя бы для начала на уровне переключения классов и перехвата событий. Я недавно рассуждал на тему фронтендщика\верстальшика и если интересно почитать можно на сайте моей команды (в профиле ссылка). Там есть инфа за пакет знаний, которые лично я считаю обязательными.
    Я хоть лично и недолюбливаю JS, все же понимаю, что без него никуда. Хочешь делать крутые сайты нужен js. Хочешь оптимизировать крутые сайты, нужен js. Главное — не лезть в jQuery. Без него трудно найти интеграции, но можно. А в большинстве случаев и не надо.
    Ответ написан
    Комментировать
  • Как поставить отслеживание для html (Gulp)?

    ArsenyMatytsyn
    @ArsenyMatytsyn
    Руководитель frontend направления, предприниматель
    Этот таск не отслеживает ничего, просто по команде берет и билдит. Нужен gulp-watch со своей мотней.
    Ответ написан
    Комментировать
  • Как скрывать/показывать блок при кликах на одну кнопку?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега JavaScript
    Руководитель frontend направления, предприниматель
    Самое примитивное:
    <input id="push" type="button" value="..." onclick="document.getElementById('ts1').classList.toggle('hidden');"/>


    К этому диву должен быть прописан универсальный или частный случай класса hidden, тогда сработает.
    Если используется бутстрап к примеру, то есть там .d-none. Впрочем, если есть бут, то есть и jQuery (не обязательно).
    Ответ написан
    Комментировать
  • Укажите на ошибки в вёрстке?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега CSS
    Руководитель frontend направления, предприниматель
    1. HTML язык, конечно, лояльный, но в символах полный ахтунг. Атрибуты (читай классы) в html заковываются в кавычки.
    2. Пробелы и переносы, это, правда, типичные ошибки начинающих и не только самоучек. Пока по шапке проверяющий с опытом не выдаст дойти трудно.
    3. Ну да и вообще на лицо ощутимой непонимание того, что и для чего это все надо. Вот это, к слову, частично поможет.
    Ответ написан
    4 комментария
  • Как добавить к известной заранее части адреса введённые данные из input и по нажатию на кнопку перейти по такой ссылке?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега JavaScript
    Руководитель frontend направления, предприниматель
    В js есть, как в пыхе, есть location. Его можно вызвать после клика и передать туда параметры ссылку.
    Ответ написан
    1 комментарий
  • С чего начать рыть для email рассылок через php?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега HTML
    Руководитель frontend направления, предприниматель
    PHPMailer, им же можно и закончить.
    Ответ написан
    Комментировать
  • Почему применяется только один медиа запрос через Sass?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега CSS
    Руководитель frontend направления, предприниматель
    1. Этот запрос последний и надо действительно его поднять.
    2. SASS\SCSS в чистом виде обычно не используется, а конвертируется в CSS, если это так, то до этой операции все изменения ни к чему не приведут.
    Ответ написан
  • Как узнать какой из элементов в контейнере находится в зоне видимости?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега JavaScript
    Руководитель frontend направления, предприниматель
    Есть такая штука, как offsetTop — расстояние элемента от начала документа. Используя его, размер области вьюпорта и значения скрола несложно высчитать текущее состояние.

    З.Ы. в JS есть группа свойств, которые позволяют оценить позиционирование элемента во вьюпорте браузера.
    Ответ написан
  • Какой стиль поможет inline-block'у?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега CSS
    Руководитель frontend направления, предприниматель
    Я так понял это типа хак с пробелами. Ну и сразу заверну, что хак хреновый. В HTML каждый символ на вес золота, пробелы в особенности. И если твой код не может в минификацию и обратно без потерь вообще, то это плохая верстка.

    К тому же есть решение в виде flexbox-ов. Со свойством justify-content: space-between. На фоне флексбоксов, тенденций оптимизации такие хаки выглядят реально очень, очень глупо.
    Ответ написан
    Комментировать
  • Какой придумать проект, связанный с работой с базами данных?

    ArsenyMatytsyn
    @ArsenyMatytsyn
    Руководитель frontend направления, предприниматель
    Ойти дело в принципе скучное. Отличие только в том, что эта абстрактная область, например магазины, в данный момент в твоей плоскости интересов.

    А вообще:
    1. Магазины
    2. Социалки
    3. Поисковой паук
    Ответ написан
    2 комментария
  • Как прочитать файл построчно с кастомным разделителем?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега JavaScript
    Руководитель frontend направления, предприниматель
    Нууу, регулярки, чтоб их, чем не угодили?
    Ответ написан
  • Как приходит набор границ?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега JavaScript
    Руководитель frontend направления, предприниматель
    Данные для карт берутся с OSM, у них что-то вроде соглашения. И есть определенные проблемы с правами, поэтому есть мнение, что из-за этого для регионов приходит свои данные. Этот вопрос лучше задавать в справко-блоге Яндекса, там с корпоративного аккаунта ответят.
    Ну а вообще отвечая на вопрос, каким образом — преобразование в JSON формат.

    В целом этим карты геморрой тот еще, буквально недавно столкнулись на одной проекте с ними. Сами выбрали подход, в целом он себя оправдал, но шаманизм... Ну наверное он того стоил. Если интересно могу кинуть линк на то, как мы это реализовали.
    Ответ написан
    2 комментария
  • Что происходит со шрифтом на сайте и в photoshop?

    ArsenyMatytsyn
    @ArsenyMatytsyn
    Руководитель frontend направления, предприниматель
    Опа. Закрываю глаза и пишу — SVG. Форматов шрифтов жеваная тьма и половина из них не поддерживается (утрирую). Лучший результат дают SVG шрифты (ИМХО), но поддерживаются откровенно криво. В плане при подключении шрифта последнее время обычно идет SVG, затем всякие Woff-ы и т.д. По какой причине может не подсосаться первый я не вдавался.
    Ну и вообще ФШ инструмент, конечно, удобный, но в целом мало имеет общего с реальностью. Чего стоит шаманство по расчету размеров при переносе макета)
    Немного оффтопом, в полиграфии, например шрифт обычно не печатается. Он переводится в кривые. В принципе для улучшения восприятия и уменьшения артефактов тот же подход оптимален и в вебе. Я сталкивался с иконочными шрифтами воичию и обнаружил жуткий артефакт. Был у одного товарища в офисе, у него подключено то ли 3 то ли 4 разного калибра и качества мониторов. В общем когда я увидел свой, с вроде предусмотренными на такие нюансы, в формате пиксельной лесенке, моему удивлению не было предела. Но как оказалось, тем же страдает и Fontawesome, что успокоило. Там же в статье я указал, что есть 2 набора, собственно шрифты, включая SVG шрифт, и символы. Символы это чистый SVG, и вот с ним проблем нет.
    Короче, шрифты это полный ахтунг. Меня периодически типать начинает при серьезной работе с ними.
    Ответ написан
  • Как вносить изменения в сайте без бекэнда?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега CSS
    Руководитель frontend направления, предприниматель
    Странно, что никто не упомянул генераторы статики. Например Jekyll. Формально это блоговая система, а на поверке мы уже несколько проектов протащили через стадию «проверим на статике, как оно работает». В том числе наш сайт.
    Очень гибкая система с низким порогом входа, но за гибкость приходится платить. Впрочем, для небольших проектов идеально.
    Ответ написан
    Комментировать
  • Как скруглить блоки сайта с CSS?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега CSS
    Руководитель frontend направления, предприниматель
    Чисто CSS — clip-path, если мне не изменяет память. Но там полно браузерных артефактов. Лучше использовать SVG маски.
    Ответ написан
    Комментировать
  • Как сделать автоматический рассчет высоты каждого элемента группы на JS?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега JavaScript
    Руководитель frontend направления, предприниматель
    Подход к вопросу огонь. Но. Как по мне, тут js не шибко и нужен. +- хватит танцев с бубном на css, путем осознания того, что в общем информация статична, и высчитывать шибко и нечего. Ну и немного абсолютного позиционирования и хаков.
    Но если действительно стоит необходимость сделать, так сказать, умную сетку, то можно перебирать их всех после полной загрузки DOM, или же еще лучше, индивидуально в момент hover. К слову, jQuery можно... В общем чистый JS нынче в треде, как говорится. Итак, ближе к конкретике:
    1. Спаси и сохрани размер обертки карточки, назовем ее ячейкой
    2. Задай самой карточке абсолютное позиционирование относительно ячейки
    3. Задисплей через прозрачность (к примеру) дополнительные элементы
    4. Рассчитай их размеры и, как в примере на дверях, высчитай отступ наверх

    Ну и главное, проверь, чтобы у ячейки не стял overflow:hidden. Бо плохо будет.
    З.Ы.: кроме морды из примера я ничего не увидел. Ну и пункты могут варьироваться.
    Ответ написан