Задать вопрос
  • Как правильно сверстать путь - "змейку"?

    5b60388f11ce8990114373.jpeg
    Ничего сложного, если напрячь извилины и увидеть ваш рисунок несколько иначе. Тогда выходит что ваша змейка это просто 3 блока с 33..33% шириной. Просто для первого блока не показывается правая и нижняя граница (border) и для верхнего - верхняя и права. Закрутку даете через border-radius, с тем, что между ними находится можете как хотите разобраться. можете сделать полосой, можете сделать блоком с только одной границей. Расположить проще всего флексами.
    Ответ написан
    Комментировать
  • Как это работает?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Массив всяких строк, которые являются названиями методов некоторых объектов в JavaScript. Но в приведенном фрагменте кода это не имеет никакого значения, т.к. они не выполняются.

    Объявляется анонимная функция, которая тут же и вызывается. В неё параметрами передают этот массив и число 185, записанное в 16-ричной системе как 0xB9.

    Внутри функции объявляется ещё одна функция e(f), ожидающая целочисленный параметр f.

    Цикл while выполняется пока это число f не достигнет нуля, уменьшаясь на 1 на каждой итерации.

    Внутри цикла вызывается метод массива push(), который вставит в конец массива значение. К свойствам и методам объекта можно обращаться и через точку myArray.push() и в квадратных скобках передав строку с названием свойства или метода: myArray['push']()

    Вставляется в массив значение, вынутое из него же, из самого начала. Выдёргивается оно методом массива shift() – записанным так же в виде строки в квадратных скобках.

    Вызывается функция e() с числом 185, увеличенным на 1, т.е. 186. В цикле это число сначала уменьшается на 1, затем оценивается, не стало ли оно равным нулю. Если ещё не стало, то выполняется тело цикла. Т.е. тело цикла выполнится 185 раз: для 185, 184, 183, ... 2 и 1.

    Вся эта конструкция сдвинет содержимое массива на какое-то число позиций, зависящее от его длины.
    Ответ написан
    1 комментарий
  • Какой CDN лучше использовать в России?

    djQuery
    @djQuery
    "Кодируем помаленьку" ("Сказка о Тройке")))
    Хорошее решение:

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.11.2.min.js"><\/script>')</script>

    Если скрипт не подгрузился из CDN, он берётся из локального файла.
    Ответ написан
    Комментировать
  • Подключение css файла к html файлу?

    @ferdasfarmazone
    Верстальщик!
    бросить это дело (web)
    Ответ написан
    Комментировать
  • Как анимировать галочку в выпадающем списке?

    Vlad_IT
    @Vlad_IT Куратор тега CSS
    Front-end разработчик
    Добавляете стрелку
    <div class="question_list">
            <ul id="list">
              <h2 class="question_title">
                Ответы на часто задаваемые вопросы
              </h2>
                <li class="question_question">"Как понять, когда зуб надо уже удалять, и когда еще можно лечить?"
                     <span class="arrow"></span>
                    <ul>
                        <li class="question_answer">Такое серьезное хирургическое вмешательство, как удаление зуба, происходит только в крайних случаях. Существуют абсолютные показания к удалению – так называемые “три О”. Первое – это острый периодонтит. Второе – отломанная коронковая часть зуба. И третье – остомиелит челюсти. Также зубы удаляют в том случае, если они неправильно ил слишком поздно прорезались и травмируют ротовую полость.</li>
                    </ul>
                </li>
                <li class="question_question">"Можно ли вылечить кисту в корне зуба?"
                    <span class="arrow"></span>
                    <ul>
                        <li class="question_answer">Да, зубы под наркозом лечат. Можно. Раньше зубы с большими изменениями в костной ткани однозначно были обречены на удаление. Имеются в виду такие изменения в области верхушек корней, как кисты и гранулемы. В наши дни качественная стоматология справляется с лечением и сохранением таких зубов.</li>
                    </ul>
                </li>
                <li class="question_question">"Обязательно ли пользоваться нитью для чистки зубов?"
                     <span class="arrow"></span>
                    <ul>
                        <li class="question_answer">При чистке зубной нитью вы удаляете зубной налет и частички пищи в таких участках полости рта, куда зубной щетке не добраться между зубами и под пришеечной частью десны и между зубами. Да, пользоваться зубной нитью обязательно, и рекомендуется делать это каждый день. Иначе скопления зубного налета могут вызвать кариес, болезнь десен.</li>
                    </ul>
                </li>
                <li class="question_question">"Что делать, если произошла травма зуба?"
                    <span class="arrow"></span>
                    <ul>
                        <li class="question_answer">Видов травм бывает много, даже в случае сломанного зуба встает вопрос, какая часть была сломана: коронковая часть или корень. Мог произойти не перелом, а подвывих. Или, может быть, вас беспокоит подвижность зуба (он шатается). В любом случае надо прийти на прием к лучшим стоматологам нашей клиники. Мы сделаем все, чтобы сохранить корень и зуб в целом. Если поврежденную часть нельзя восстановить, мы окажем хирургическую помощь.</li>
                    </ul>
                </li>
            </ul>
          </div>

    в js пишите
    $(document).ready(function () {
        $('#list > li').click(function (event) {
            $(this).find('.arrow').toggleClass('active');
            $(this).children("ul").slideToggle();
            event.stopPropagation();
        });
    });

    В стилях
    .arrow {
    transition: transform 1s;
    }
    .arrow.active {
    transform: rotate(90deg);
    }
    Ответ написан
    5 комментариев
  • Верстка с нуля: какие основные этапы работы?

    Vlad_IT
    @Vlad_IT Куратор тега Вёрстка
    Front-end разработчик
    Использую vscode+webpack+pug+scss+бэм. Из физических инструментов, основной моник: lg ultrawide 29um69g, рядом прикручен моник от ноутбука повешенный вертикально, подключенный через универсальный скаллер.

    0) Запускаю Spotify :-)

    1) Произвожу установку всех необходимых модулей для сборки. В моем случае у меня набор конфигураций для webpack (отдельные файлы для pug, scss, static и.т.д., выбираю что нужно).

    2) Запускаю avocode, загружаю в него макет. Определяю в нем переменные (в то же время записываю их, чтобы сразу кинуть в scss файл) для цветов, размеров шрифтов и.т.д. чтобы при получении кусочков кода из него, он сразу расставлял переменные.

    3) Запускаю VS Code, открываю нужную папку.

    4) Пишу размету на Pug. Пишу с БЭМ, если встречаю повторяющийся блок, то открываю файл _mixins.pug, в который пишу миксины для повторяющихся блоков, например товаров, пунктов меню, каких-то блоков и.т.д. Pug умеет делать циклы, это ускоряет сильно.

    5) Когда HTML готов, начинаю делать каркас. Если дизайн сделан по сетке, определяю контейнеры, колонки, строки в свои классы (не пишу в html тучи классов аля col-md-6, а пишу в SCSS инклуды в нужные мне блоки, типа @include make-col(2) и.т.д.).

    6) Экспортирую картинки из Avocode. Очень делается просто, указываю папку и просто кликаю экспорт и ввожу название файла и расширения. Преимущественно для иконок использую svg, если нет svg, то ищу эту иконку в интернете (дизайнеры редко рисуют иконки сами, но зато любят вставлять их не в векторе). Если иконка простая, могу сам ее в inkscape обвести, ну и если нет, то экспортирую png в размере (благо авокод это позволяет, если конечно дизайнер не вставил в исходном маленьком размере). Когда есть контакт с дизайнером, трясу его, ибо растр это плохо для иконок.

    7) Пишу стили блоков из страницы. На этом этапе можно на втором монике параллельно смотреть футураму или
    Арчера :-) Но чаще на широком монике слева браузер, справа VS Code, а на втором монике Avocode (может меняться местами с браузером). Мысленно нарезаю страницу на блоки. Для каждого блока (БЭМ) создаю отдельный scss файл (кто-то даже для элемента создает, но мне лень), из него сразу выписываю все селекторы. Иногда могу сначала выписать все селекторы со страницы (но так лучше не делать, т.к. во время работы может потребоваться изменить что-то в разметке), но чаще для одного блока выполняю этот пункт и за ним сразу выполняю пункт 8, потом для нового блока опять 7 и 8 и.т.д.

    8) Пишу css код вместе с Avocode, у него беру нужные мне параметры (а он уже подставил в них переменные), и вставляю в мой код. И параллельно сверяю со скрином макета используя вот это расширение https://chrome.google.com/webstore/detail/perfectp...

    9) Пишу адаптив. Я не могу привыкнуть к методологии mobile-first, поэтому пишу всегда сначала полную версию сайта. Я понимаю, что это чревато всякими проблемами и это типа не модно, но мне норм.

    10) Медиа-запросы пишу прямо в блоках, для каждого блока/элемента/модификатора может быть отдельный медиа-запрос. Но для начала определяю breakpoint'ы для разных экранов (чтобы их не было сотни разных), если использую Bootstrap, то беру его breakpoint'ы.

    11) Добавляю анимашки. Даже если заказчик не просил отдельно (и если не указал отдельно, что нельзя), он все равно будет доволен, а с animate.css+onscreen.js это вообще работа 10 минут. Сложные анимации обговариваю отдельно, чтобы не сделать ненужную работу.

    11) Все снова сверяю, пишу скрипты где надо. Для слайдеров в 99% случаев подходит slick (с доработками конечно, но там хорошее API), для других случаев могу написать свой.

    12) Сдаю заказчику и жду ответа сидя на тостере/пикабу.

    Это чисто мой опыт, опыт фрилансера, не знаю, как делают другие и не могу на 100% утверждать что это 100% правильный способ. Я так и не смог заставить свой конфиг webpack правильно вставлять спрайты svg.
    Надеюсь чем-то поможет мой ответ.
    Ответ написан
    7 комментариев
  • Чем заменить метод map на объекте?

    rockon404
    @rockon404
    Frontend Developer
    const obj = {0: "ребёнак", 1: "рибёнок", 2: "ребёнок", 3: "рибёнак"};
    
    const result = Object.values(obj).map((item, i) => (
      <Button
        key={i}
        onPress={() => this.getQuestions(item)}
        title={item}
      >
        {item}
      </Button>
    ));


    Не очень хорошая конструкция:
    this.props.gamedata.questions[2].options;
    Лучше переделать так:
    this.props.gamedata.questions.map(question => (
      <Question key={question.id} data={question} />
    ));
    Ответ написан
    Комментировать
  • Откуда появляется горизонтальный отступ у инлайн-блоков?

    aliencash
    @aliencash
    Партизан
    Вы меняете способ отображения блочного элемента на строчный (inline). В этом случае элемент ведет себя как символ. Так же как буква или цифра или спец.символ в тексте. А особенностью символов является межсимвольный и междустрочный интервалы. На скриншоте вы как раз и видите междустрочный интервал между inline-блоками.
    Ответ написан
    3 комментария
  • Почему когда вместо div.parentNode написать body, то код запускается, но не пропадает текст?

    rockon404
    @rockon404
    Frontend Developer
    Потому что надо писать document.body
    document.body.removeChild(div);
    Ответ написан
    Комментировать
  • Безопасно ли держать провода в собранном виде?

    Stalker_RED
    @Stalker_RED
    На звук это настолько слабо повлияет, что даже приборами будет сложно засечь.

    А вот нагруженные силовые кабеля так лучше не складывать. Если свернуть кольцами удлинитель и подключить что-то мощное, типа электрообогревателя, то можно заметить как эти кольца будут греться. Иногда до расплавления дешевой изоляции → короткого замыкания → пожара.
    Ответ написан
    5 комментариев
  • Есть ли менее "замудрёное" решение?

    @balamyt92
    ; select * from users; --
    Это самое верное и правильное решение. В нем нет ни грамма мудрёности. Если вам так сказали то вероятно уровень собеседующего был ниже (на уровне плинтуса).
    Ответ написан
    Комментировать
  • Обьясните как работает if в jQuery?

    Точно так же как и в javascript
    Условные операторы
    Ответ написан
    Комментировать
  • Как решить задачу на javascript?

    rockon404
    @rockon404
    Frontend Developer
    (function isNumberOne(one) {
      'use strict';
      function numberOne() {
        if (this !== 1){
          throw new Error('I`m not number one!');
        } else {
          console.log('I`m definitely number ONE!');
        }
      }
      numberOne.call(one);
    })(1);

    строгий режим
    Ответ написан
    Комментировать
  • Стратегия входа, путь развития во фрилансе. С чего начать, чтобы стать верстальщиком и php-программистом?

    opium
    @opium
    Просто люблю качественно работать
    Решение очевидно заходишь на фриланс биржу и смотришь описания работ.
    Ответ написан
    Комментировать
  • Интересная верстка?

    @Deexter
    Можно поступить подобным образом https://jsfiddle.net/arfdnvum/1/
    Ответ написан
    1 комментарий
  • Какие книги полезны для повышения эффективности одного программиста?

    @asd111
    Производительность сильно зависит от генов, от физического и психологического состояния и от наличия раздражающих факторов во время работы. И ещё производительность сильно зависит от уровня подготовки и знания алгоритмов в своей сфере.
    Например олимпиадники могут за 4 часа сделать больше чем средний программист за день и причина в том что они другие физически, психологически и по уровню подготовки. Например им не нужно думать какой алгоритм как реализовать, они просто берут готовый код из головы.

    Это как в шахматах средние игроки думают во время дебюта, а опытные просто играют по памяти свой любимый дебют и почти не думают над ходами во время дебюта. А такие мастера как Магнус Карлсен могут выиграть за 30 секунд у большинства средних игроков. Выглядит это пугающе(https://youtu.be/NTEj4moaay0 )

    И примерно такая же разница между слабыми и сильными программистами. Это прежде всего физиологические различия и различия в уровне подготовки. Книги про продуктивность тут не увеличат производительность каким то радикальным образом. Скорее наоборот если человек со слабыми природными данными начнет много программировать то у него быстро наступит выгорание, потому что его ЦНС физиологически на это не способна и производительность в результате может упасть.
    Ответ написан
  • Есть какие-нибудь сайты, где люди с идеей объединяются/ищут "за бесплатно" людей для реализации проекта?

    fl.ru Объединяются халявщики и владельцы сервиса для окучивания дураков мечтающих заработать.
    Ваше мнение может не совпадать с моим.
    Ответ написан
    Комментировать