Ответы пользователя по тегу Вёрстка
  • Как и каким способом лучше спозиционировать изображения?

    polyak-888
    @polyak-888
    Js, React.js, css, frontend
    Еще можно так
    для блока обертки:
    display: flex;
        flex-wrap: wrap;
        margin-left: -10px;
       margin-right: -10px;


    для блоков с картинками учитывая что их 4 штуки и расстояние между ними 20px:
    width: calc(25% - 20px);
    margin-left: 10px;
    margin-right: 10px;


    Картинки у тебя закрывают текст, это наверное не есть гуд. Лучше сделай их фоном.
    Может где-то надо поправить. Но смысл такой))) Сам такой макет верстал когда-то на bootstrap 3)))
    Ответ написан
    Комментировать
  • Что использовать для гамбургер меню JS или jQuery?

    polyak-888
    @polyak-888
    Js, React.js, css, frontend
    prgssr.ru/development/tryuki-s-psevdoklassom-targe... пример есть как делать при помощи псевдокласса target. А если выбирать между нативным Js или Jquery я бы выбрал Js. Вся логика будет в добавлении/удалении класса. По коду разницы не будет, зато не надо будет подключать Jquery.
    Ответ написан
  • Как сменить положение?

    polyak-888
    @polyak-888
    Js, React.js, css, frontend
    Сделай div обертку и задай ей display: flex. В нем два дива. В первом картинка во втором твои инпуты. И чтобы инпуты были друг под другом оберни каждый инпут в тэг <p>. Так как тег <p> блочный он буде занимать всю строку и следующий тэг соответственно будет под ним
    Ответ написан
  • Как подобное верстать?

    polyak-888
    @polyak-888
    Js, React.js, css, frontend
    Ничего себе паутинка))) А чем плоха старая сетка колонками 12, 16 и т.д)) Очень странно что сделали такую сетку при таком слабеньком макете. На первом скрине видно, что правая часть 50% и левая столько же. И у правого и левого блока есть падинги отделяющие их. Я бы сделал флексами или гридами если не важна поддержка старыми браузерами. И каждый вложенный блок во флекс-контейнере по 50%, внутри каждого из блоков также можно использовать флексы. Если любите сетку то используйте какую-нибудь css-библиотеку с сеткой (их сейчас целая куча)
    Ответ написан
    1 комментарий
  • Как остановить бесконечное добавление кнопки при изменении экрана?

    polyak-888
    @polyak-888
    Js, React.js, css, frontend
    Привет, я с такую проблему решал при помощи флага, что-то типа того:

    let flag = false
    
    $(window).resize(function() {
      width = $(window).width();
      if (width < 991 && !flag) {
        $('.navbar__button').remove();
        flag = true
      }
      else if (width >= 991 && flag)  {
        newdiv = $("<button id=\"navbar-btn\" class=\"button callback navbar__button\">Заказать звонок<\/button>");
        $("#navbar-info").append(newdiv);
        flag = false
      }
    });
    Ответ написан
    Комментировать
  • Как менять стиль при наведении на блок?

    polyak-888
    @polyak-888
    Js, React.js, css, frontend
    А Вам надо чтобы при наведении на один блок, подсказка вылезала сразу на всех или на том на который навели? И Вы хотите сделать обязательно на нативном js или css тоже устроит? Если все равно, то лучше сделайте на css. Если решили на js, то советую не перебирать массив элементов через цикл и вешать на каждого обработчик события, а повесить обработчик только на родителя и через делегирование событий (через event.target) Вы сможете применить обработчик к каждому элементу. Более подробно Вы можете почитать здесь: https://learn.javascript.ru/event-delegation
    Ответ написан
    Комментировать