• Как лучше организовать рабочее окружение для веб разработчика?

    sim3x
    @sim3x
    Начните с виртуалки, а там сами поймете
    Ответ написан
    Комментировать
  • Как с помощью css сделать вот такое подчёркивание?

    weranda
    @weranda
    Варианты:
    1. Добавить внутрь главного тега два тега и задать им стили.
    2. Добавить один тег внутрь главного тега и задать ему стили :before и :after
    3. Задать стили :before и :after главного тега
    4. Добавить фоновое изображение (svg)
    Ответ написан
    Комментировать
  • Какую выбрать книгу для изучения JavaScript?

    Adamos
    @Adamos
    Свежий Флэнаган (6-е издание).
    И серьезная база, и не устарел.
    Ответ написан
    5 комментариев
  • Пропадает мотивация к изучению python, правильно ли я делаю?

    sergey-gornostaev
    @sergey-gornostaev Куратор тега Python
    Седой и строгий
    Но, я прекрасно понимаю, что делает определенная строка кода, что нужно изменить, чтобы заработало так, как нужно мне и т.д.

    Но не могу написать все сам с нуля, что-то вылетает из головы, что-то забываю, и снова приходится подглядывать.

    Это называется "иллюзией компетентности", ваш мозг вас обманывает.

    Важно правильно работать с учебным кодом. Не запускать скачанный с сайта издательства код, а набирать его самостоятельно, после прочтения главы, и пытаться запустить. Если запуск не получается, то главу вы не поняли и её надо перечитать. После того, как запуск удался, можно сравнивать свой код с кодом автора. Стоит поэкспериментировать с кодом, внести в него несколько изменений, чтобы убедиться, что вы действительно понимаете, как он работает, а не просто успешно повторили заученные действия.

    P.S. У вас заголовок вопроса расходится с текстом. Непонятно на что именно отвечать.
    Ответ написан
    3 комментария
  • Как задавать значение типа шрифта, или его начертания? Ну там... regular, thin, bold, light и т.д?

    Ankhena
    @Ankhena Куратор тега Вёрстка
    Нежно люблю верстку
    100 - Thin (Hairline)
    200 - Extra Light (Ultra Light)
    300 - Light
    400 - Normal
    500 - Medium
    600 - Semi Bold (Demi Bold)
    700 - Bold
    800 - Extra Bold (Ultra Bold)
    900 - Black (Heavy)

    Можно инструменты разработчика открыть и посмотреть:
    5c883293e9f89489813933.png
    Ответ написан
    Комментировать
  • Как заменить картинку, одну на другую?

    delphinpro
    @delphinpro Куратор тега CSS
    frontend developer
    dollar показал один и вариантов (не лучший).
    Вот еще один (тоже хреновый)
    <img src="https://loremflickr.com/g/200/200/carnaval"
         style="display:none"
         onload="this.style.display='inline-block'"
    >


    И еще один, применяемый повсеместно, лучший на мой взгляд (плюс одно решение будет работать для любых элементов)

    <html id="no-js" lang="en">
    <head>
      <script>document.documentElement.id = 'js'</script>
      <style>#no-js .no-js-hidden { display: none !important; }</style>
      ...
    </head>
    <body>
    ...
    <img class="no-js-hidden" src="https://loremflickr.com/g/200/200/carnaval">
    ...


    Плюс вы можете использовать в ваших стилях селекторы #no-js и #js для разделения по принципу наличия включенного javascript
    Ответ написан
    1 комментарий
  • Как сделать точное вычисление физики гравитации на javascript в canvas методом Верле?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    elleremo, ускорение которое получают планеты пролетая вблизи других планет не является ошибкой!!!

    Этот эффект называется "гравитационный маневр для ускорения объекта" или же "гравитационная праща"

    Swingby_acc_anim.gifГравитационный манёвр для ускорения объекта (гравитационная праща)

    Не стал делать "точную имитацию" гравитации. Пошел по пути:
    1. каждый объект имеет массу равную объему объекта умноженному на плотность объекта
    2. каждый объект влияет на каждый динамический объект
    3. влияние пошагово рассчитывается по формуле (почти) :
    V = сумма(F); // суммарный вектор сил
    F = k*M/D; // сила влияния (расчитывается для каждого объекта оказывающего влияние на текущий)
    M - масса объекта
    D - квадрат расстояния между центрами масс объектов
    k - коэффициент для подгона скоростей (выполняет роль гравитационной постоянной)

    Алгоритм расчета (пошагово):
    1. Для каждого динамического объекта происходит расчет новых координат (сумма текущих координат и вектора скорости, рассчитанного на предыдущей итерации цикла симуляции)
    2. Каждый динамический объект сверяется с каждым объектом на предмет столкновения. Если расстояние между центрами 2х сравниваемых объектов меньше суммы их радиусов то происходит слияние. Если объединяются статичный и динамический объекты, то динамический удаляется а его масса добавляется к статическому с перерасчетом плотности, радиуса и объема. Если объединяются 2 динамических объекта то к первому добавляется масса второго с перерасчетом плотности, радиуса и объема, координаты и вектора скоростей пересчитываются как взвешеная сумма координат и векторов скоростей обоих объектов. После второй объект удаляется.
    3. Для каждого динамического объекта расчитывается сумма векторов силы влияния притяжения всех объектов. Затем данная сумма и вектор скорости текущего объекта суммируются
    4. Переход к новой итерации цикла симуляции.

    Вся реализация расчета тут (в конце скрипта). Все формулы вынесены в класс Calc.

    видеодемонстрация
    демонстрация (масштабируется колесиком мышки, перетаскивается с помощью ЛКМ)

    Добавил слияние планет при столкновении (массы суммируются, вектора скоростей суммируются, позиция переносится в центр масс)
    Добавил источники (автоматически генерируют планеты)
    Добавил отдельные кнопки для пуска и остановки источников

    5bbd21b57da99316097769.png
    Добавил настройки:
    • параметры отображения
      • отображать сетку - вкл/выкл отображение координатной сетки
      • отображать источники - вкл/выкл отображение объектов, генерирующих планеты
      • отображать шлейф - вкл/выкл отображение траектории планет

    • Настройки физических величин - позволяют задаь минимальные и максимальные значения для размеров и плотности статических и динамических объектов
    • Управление симуляцией
      • шаг симуляции - экспериментальная величина регулирующая точность расчетов
      • скорость источников - изменяет скорость, с которой источники генерируют планеты
      • включить источники - вкл/выкл генерацию планет источниками



    Доработал механизм расчета влияния гравитации, теперь у каждого объекта масса считается исходя из объема и плотности.
    Ввел изменение в процесс генерации новых планет, теперь они выставляются на лист с рассчитанной первой космической скоростью относительно центрального статичного объекта.
    Установил статичным объектам повышенную плотность, что существенно увеличило их массу (можно менять на панели настроек)
    Установил динамическим объектам пониженную плотность, что существенно уменьшило их массу и взаимовлияние (можно менять на панели настроек)

    5bbd22bc10be0483291405.png
    Ответ написан
    2 комментария
  • Как получить список id элементов, имея их общий класс?

    hzzzzl
    @hzzzzl
    const ids = [...document.querySelectorAll('.className')]
      .map(tag => tag.id)
      .filter(id => id)    // убираем пустые "без id" по желанию
    Ответ написан
    3 комментария
  • Сделать текст более комфортным и читаемым?

    mixail_fet
    @mixail_fet
    Дизайнер веб-интерфейсов
    Несколько советов, которые помогут быстро сделать из текста, более читабельный продукт:

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

    2. Разбавьте текст инфографикой или иконками, поиграйтесь с визуальными подсказками - так текст будет восприниматься интереснее.

    3. Не забывайте про маркерные списки, где идет перечисление чего-либо, этим вы сделаете текст более понятным.

    4. Разбивайте текст на абзацы, текст не должен читаться в один заход, в идеале его можно разделить на 3 - 4 абзаца.
    spoiler
    5c7a7216bd6a9860995173.jpeg


    5. Добавляйте h3 заголовки, там где можно разделить текст на смысловые части. Например тут можно применить два заголовка и разделить текст на 2 абзаца:
    spoiler
    5c7a72f5d2958558236414.jpeg

    Перефразировав их в: Описательная часть, Основная часть

    Несколько интересных статьей на тему:
    https://habr.com/ru/post/31547/
    https://habr.com/ru/post/57351/
    https://habr.com/ru/post/36654/
    Ответ написан
    2 комментария
  • Что мне делать если я хочу стать разработчиком игр но не чего по этому не знаю?

    saboteur_kiev
    @saboteur_kiev Куратор тега Разработка игр
    software engineer
    Игры - это те же самые программы.
    Поэтому осваивайте базовые навыки программирования.

    Попробуйте реализовать простейшие старые добрые игры, типа морской бой, сокобан, какие-нибудь текстовые квесты.
    На текущем этапе нет смысла сразу выбирать специализацию на всю жизнь - просто попробуйте реализовать одну и ту же игру на разных языках программирования - на Java, на C++, на JS, чтобы понять инфраструктуру вокруг языков.

    Ну и для начала, было бы неплохо стать продвинутым пользователем.
    Ответ написан
    6 комментариев
  • Как удалить вложенные массивы по условию?

    potapchino
    @potapchino
    const arrM = arr.filter(subarr => !subarr.some(item => item.value === '-'))
    Ответ написан
    Комментировать
  • Как переместить в конец массива элементы имеющие определённое свойство?

    alexey-m-ukolov
    @alexey-m-ukolov Куратор тега JavaScript
    arr.sort((a, b) => a.pos ? 1 : (b.pos ? -1 : 0))
    Ответ написан
    Комментировать
  • Как получить последний каталог из url?

    Sanasol
    @Sanasol Куратор тега PHP
    нельзя просто так взять и загуглить ошибку
    explode('/', $string);

    А дальше сами догадайтесь как достать последний элемент результирующего массива.
    Ответ написан
    Комментировать
  • Как сверстать макет, ширина которого больше, чем ширина экрана моего монитора?

    Ankhena
    @Ankhena Куратор тега CSS
    Нежно люблю верстку
    Не скачивала полный макет, а только смотрела превью, но ширина макета у вас не 1920. Это только дизайнер показал, как все должно выглядеть, например, на 1920.
    Посмотрите внимательно: есть фиксированная контентная ширина, а все что выходит за нее должно быть растянуто на всю ширину окна браузера, любую.

    Так что на 1600 (да и на 1200 тоже) у вас не должно быть никакой горизонтальной полосы прокрутки.
    Ответ написан
    3 комментария
  • Объединение двух разделов hdd БЕЗ потери данных - реально?

    Jump
    @Jump
    Системный администратор со стажем.
    Ну во первых непонятно как именно вы собрались наращивать раздел?
    Увеличить размер раздела штатными средствами можно только если есть свободное место после этого раздела.
    А системный раздел который вы удалите насколько я понимаю перед ним.
    Поэтому нарастить не получится. (Если диск не динамический)

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

    Ankhena
    @Ankhena Куратор тега CSS
    Нежно люблю верстку
    Не оттуда пляшете.

    Давайте я вам как девочка девочке всё объясню. На примере джинсов.
    Есть такая штука мода. Сейчас в обтяжку, раньше клеш или широченные. Но при этом всегда остаются люди предпочитающие классику или консерваторы, которые предпочитают даже слегка устаревшую классику.

    Так вот, с сайтами аналогичная история.
    10 лет назад считалось, что шрифт 14px это гигантомания и использовали 10 или 12. Между строчками крошечные отступы. Особо нерадивые даже между абзацами пытались не делать пустых строк.

    Есть мода и восприятие пользователем современных сайтов. То, как хочется видеть именно сейчас. Изменяются даже пропорции и зависимости.
    96 это точно такое же красивое число как 100. Это 16*6. А 16 это стандартный размер шрифта основных браузеров.

    Кроме этого есть аспекты адаптивности.
    И правильно не ширина кнопки равна 100 или 96px, а ширина кнопки это ширина текста плюс отступы. И хорошо бы, чтобы эти отступы были пропорциональны размеру шрифта, а не кратны 5px. Вы поставите отступ четко 20px, а пользователь поставит в настройках браузера шрифт 150%. И получится куцая кнопка с некрасивыми маленькими отступами.
    При этом не все элементы должны быть кратны размеру шрифта, какие-то имеют другие зависимости.

    Другой вариант, пропорции относительно размеров экрана или блока. Например, кнопка должна занимать всю ширину блока или половину. Если текст не помещается, то переносится.

    Поэтому, хороший дизайнер либо сопровождает работу верстальщика, либо пишет сопроводительное письмо с указанием зависимостей, либо и то и другое.

    И да, дизайнер может четко сказать, что справа отступ 19px, а слева 17, потому что визуально (например, из-за особенностей шрифта) получается ровно. Если это проблема для верстальщика, то не надо работать с таким верстальщиком.
    Верно и в обратную сторону, если дизайнер нагородил какую-то невменяемую конструкцию из-за которой прибавляется лишняя 1000 строчек кода, то имеет смысл обсудить целесообразность ее использования с самим дизайнером и заказчиком.

    Про вклад заказчиков в дизайн, я думаю, вы и сами знаете. У них особенное чувство прекрасного, хорошо, если просто консерватор из первого абзаца.
    Ответ написан
    6 комментариев
  • Как быстро въехать в чужой проект?

    YershovAleksandr
    @YershovAleksandr
    Java Developer
    Все свои полученные знания по проекту нужно сразу фиксировать. В идеале в электронном виде, но можно и на бумаге. Это твоя документация.
    Имей ввиду что в зависимости от руководства тебя могут или похвалить или на оборот скажут что ты время зря тратишь и так всё понятно. Скорее будет второе!
    Для прокачки кармы, если захочешь, потом передашь свою писанину следующему гребцу.
    Ответ написан
    1 комментарий