Задать вопрос
  • Как лучше избежать загрузки кешированных файлов?

    @ksnk
    tyxeo, да что-то вроде
    <?php
    // самые первые строки файла, пока ничего не выводится в броузер
    header('Cache-Control: no-store');
    // все остальное

    В принципе - этого может хватить.

    Если это одностраничник с известно где расположенными стилями и скриптами, то можно так генерировать ссылки на них
    function link($link){
       if(is_readable($link)){
         return $link.'?'.filemtime($link);
       } else if(false===strpos('?',$link)) {
         return $link.'?'.rand(1000,99999);
       } else 
         return $link;
    }


    <link rel="stylesheet" type="text/css" href="<?=link('css/styles.css')?>"...

    Так появится возможность все таки кэшировать на клиенте неизмененные файлы. По внешнему виду ссылок (количество цифр после имени файла) можно понять, находит php файл исходник или нет.
  • Как лучше избежать загрузки кешированных файлов?

    @ksnk
    Возможно, стоит познакомится с документацией. Если доступно изменение заголовков - то поставить на период отладки Cache-Control: no-store может оказаться разумным решением.

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

    mayton2019, к примеру, включено кэширование заголовком Cache-Control: навечно
  • Что делать если попап окно уже открыто при загрузке на сайт?

    @ksnk
    Повесь на событие window.onfocus функцию, которая выясняет - открыто окно или нет. Событие будет срабатывать всегда, когда переключаешься по вкладкам броузера, так что осторожнее с лишними действиями.
    Такое (внезапно открытые окна) бывает когда делается возврат кнопкой Back по истории, отследить такое тоже можно, но сложнее и иногда с глюками.
  • Не маштабируется svg в clip-path?

    @ksnk
    clip-path никак не масштабируется. Если хочется использовать именно clip-path, то резиновость будет сложно прикрутить. Ее можно подменить медиа запросами и фиксированной шириной
    .bottom-menu {
        position: fixed;
        bottom: 0;
        z-index: 100;
        overflow-x: hidden;
        height: 82px;
        width: 1000px;
        left: 50%;
        transform: translateX(-50%);
    }
    Тут вставлено выравнивание по середине фиксированного блока и проставлена абсолютная ширина. Для разных разрешений можно добавить разные svg для для резки.
    Ну и вставлять ненужный svg в код как-то не очень красиво. Вот такое правило
    .bottom-menu  {
       clip-path: path("M0 81.99l0 -54.18 457.77 0c6.94,-0.23 11.28,-1.66 13.74,-8.95 8.53,-25.15 48.45,-25.15 56.98,0 2.46,7.29 6.8,8.72 13.74,8.95l457.77 0 0 54.18 -1000 0z");
    }
    позволяет сделать примерно то же самое. Да и менять контуры для резки меню в медиа-секции станет удобнее.

    Есть более другие способы рисования всяких круглоэлементов, с помощью linear-gradient и radial-gradient. Вот тут я творчески утащил отсюда же какой-то интересный мне пример. Если не обращать внимание на "круглость" перехода от активного элемента к нективному - все, примерно, такое как тут надо.
  • Как закрасить прозрачную область png?

    @ksnk
    У вас PNG не той системы... Нужно оставить прозрачным только то, что нужно перекрашивать, а не весь белый фон вообще.
    Возможно поможет вот это How do I do flood fill on the HTML canvas in JavaScript?
  • Как сверстать позицию блоков?

    @ksnk
    А в чем проблема-то ? Сделать полупрозрачный бякграунд?
  • Валидация с setCustomValidity. Можно ли сократить этот код?

    @ksnk
    Тут надо не сокращать, а менять. Валидировать по имени поля - это гарантированно дублировать весь комплект валидации для каждой новой формы. Например, телефон, обычно, помечается < input type="tel" ... Так что накручивать на него логику проверки на телефонный номер нужно при наличии именно такого типа поля. email вполне корректно фильтруется самим броузером type="email"
    Есть встроенная в броузер валидация по регулярке, если автоматически приписывать к полю с телефоном атрибут pattern="регулярка проверки на телефон", должно быть примерно что надо.
    К этой долгой странной песне придется накручивать проверку данных на стороне сервера, фактически дублируя проверки уже сделанные на стороне броузера.

    Можно пойти с конца, сделав минимальную проверку в броузере, чисто на встроенных механизмах, переслав данные серверу, и продемонстрировать обнаруженную сервером ошибку в данных.

    Что нибудь вроде такого
    var h=function(){
                this.setCustomValidity('');
            }
            // убираем сообщение об ошибке при начале изменения в поле. Неплохо бы добавить обработку 'paste'
            $('input, textarea', form_selector).change(h).on('keydown',h);
    
            function setInvalid(invalid, form) {
                // неплохо бы убрать сообщение об ошибке из предыдущей проверки
                 $('input, textarea', form).trigger(h);
                // ставим первое сообщение в списке ошибок
                for(var a in invalid){
                    var i=$('[name="'+a+'"]', form);
                    if(i.length>0) {
                        i[0].setCustomValidity(invalid[a]);
                        i[0].reportValidity();
                        return;
                    }
                }
               // не найдено поля с таким именем - выводим ошибку в специально обученное место
               console.log('opps!', invalid);
                
            }

    Ajax должен передавать данные в виде отдельного поля результата - error:{`имя поля`:`сообщение об ошибке`}, просто для определенности, что ошибка была обнаружена и форма не была обработана сервером
    ...
    success: function(data){
         if(data.error){
               setInvalid(data.error,form);
               return ;
         }
    }

    Из минусов - выводится только одна ошибка в единственное поле формы. Это свойство самого setCustomValidity, насколько я понимаю, если лепить несколько раз, все равно будет демонстрироваться один последний. Но никто не мешает отправить форму еще раз
  • Как сделать pdf файл для скачивания из элемента битрикс?

    @ksnk
    Содержимое больше похоже на предупреждение об ошибке. Можно посмотреть в bitrix/modules/error.log, обычно, настоящие сообщения об ошибках попадают туда.
  • Как зациклить волну, сделанную из кривой безье в canvas.js?

    @ksnk
    Подобрать параметры setLineDash так, чтобы не прыгало при сдвиге. Или кратно увеличить размер отрисовываемой области, чтобы помещалось точное количество пунктиров.
  • Почему mail.ru некорректно отображает html-письмо?

    @ksnk
    Верстка писем - это отдельное искусство разметки. Вымирающее, к счастью, но пока еще, благодаря mail.ru - живое... Верстай таблицами, йуный падаван... Ну и все стили не в отдельных блоках-файлах, а прямо в стилях тегов. Просто открой в mail.ru спам письмо, которое выглядит нормально и посмотри разметку. html5-говоришь? Это mail.ru style!...
  • Как правильно хранить контент поста?

    @ksnk
    Дмитрий, Абстрактная разметка лучше чем очищенный html тем, что для html появляется желание сэкономить на парсинге исходников при смене стилей. К примеру у нас есть набор страниц. На каком то этапе жизни сайта поступило предложение выводить контента поменьше и влепить кнопку "читать дальше". Решением будет довольно тупо посчитать текстовую длину контента и примерно посчитав, воткнуть кнопку в подходящее место. Для клинически непросчитываемых случаев - явно указать место расположения кнопки. Для ББ кода - это еще один код, вставленный в текст. Для html появится желание обойтись без дополнительного парсинга исходников и вставить кнопку как есть, со стилями и скриптом, или хотя бы с классами. Собственно, cама возможность вставки элементов с непредсказуемыми зависимостями и будет "хуже".
  • Как правильно хранить контент поста?

    @ksnk
    irishmann, Ну, я бы посмотрел, как неочищенный html из ворда, к примеру, будет отображаться при смене стилей сайта. Прелесть независимого формата в независимости.
  • Как правильно хранить контент поста?

    @ksnk
    Контент удобно хранить в чем-то вроде BBкодов. Соответственно, парсер HTML в коды и парсер в обратную сторону для отображения. В реальности, это означает, что в табличке хранятся BB "исходники" и html контент, который отрендерен в текущих стилях, для быстроты отображения. Сам принцип удобен тем, что коды ничем не ограничены, если что-т не хватает - можно придумать еще один код, многие wysiwyg редакторы сами могут выдавать код с BB и билдер в html делается регулярками на коленке. Это про контент поста. Сулужебную обертку уже можно хранить как будет удобнее.

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

    @ksnk
    Это к чему вопрос? Устроит ли тебя экран 3 дюйма на 6 (7см на 15.6)? С такими размерами и таким разрешением можно точно, пиксель в пиксель отобразить нужную картинку. По сути - вполне себе нормальный мобильник...
  • Как отпозиционировать элемент относительно декоративного элемента фона?

    @ksnk
    Если по каким-то причинам комментарий @Вадим'а не подойдет, к примеру, верхние активные элементы тоже могут свободно "гулять" по экрану, то придется вручную позиционировать элемент, с помощью javascript. На каждый onresize перевычислять с каким зумом и в какое место нужно поместить картинку. Зум и положение можно расчитать как верх - верх надписи "Best SEO & ...", низ - верхний край нижнего блока меню (Website & Social...) Ну и чтобы вправо не вываливалось...
  • Как наложить несколько прозрачных png-изображений, чтобы они показывались по отдельности при наведении курсора?

    @ksnk
    Елизавета, еще вариант - нарисовать области разным цветом на другой картинке, Один цвет - одна область с подсказками. Вставить поверх картинки с такими же правилами на изменение размеров канвас с этой картинкой и opacity:0. Когда кликают на канвас - вычисляет цвет точки клика и показываем нужный слой.
    В принципе - вставлять не обязательно, но тогда придется перевычислять координаты пропорционально, что тоже несложно...
    Так можно довольно удобно задавать области на картинке.
  • Как вывести график функции JS при нажатии на кнопку?

    @ksnk
    Попробуй убрать document.write из скрипта. Используй console.log вместо этой конструкции. Ну и параметры передавать не таким странным образом, а просто массив. Если Chart.js подключен, то все должно работать. https://codepen.io/ksnk/pen/poQGegJ
  • Почему canvas на телефоне работает по другому?

    @ksnk
    Вообще-то не совсем канвас, а совсем даже webgl. Поищи примеры webgl. Если на телефоне они так и выглядят - вот и причина.