• Как реализовать анимацию изменения цифр используя React.js?

    0xD34F
    @0xD34F Куратор тега React
    function Counter({ val, time }) {
      const [ currVal, setCurrVal ] = useState(0);
    
      useEffect(() => {
        currVal !== val && setTimeout(setCurrVal, time, currVal + 1);
      }, [ currVal ]);
    
      return <div>{currVal}</div>;
    }

    https://jsfiddle.net/jsxopeag/
    Ответ написан
    Комментировать
  • Почему не отображает компонент | react-router-dom?

    Seasle
    @Seasle Куратор тега React
    Для деплоя приложения на GitHub Pages необходимо корректно настроить Vite/Webpack.
    Для Vite необходимо указать base - пример.
    Для Webpack необходимо указать homepage.
    Также вот пример настройки автоматического деплоя на GitHub Pages.
    Ответ написан
    Комментировать
  • Как убрать смещение ссылок при увеличение жирности текста?

    SeaInside
    @SeaInside
    15 лет пилю все эти штуки
    А никак.
    Если нужно делать при наведении текст жирным, чтобы он не менял свои размеры, то можно использовать хак при помощи text-shadow.
    Пример сделать сейчас нет возможности, загуглите "text-shadow like bold" - там всё расскажут.
    Ответ написан
    Комментировать
  • Зачем return в программе?

    @MiiNiPaa
    Вот если указано return 0; - то программа закончиться.Я правильно понимаю?
    Только если это return в main().

    return это команда закончить текущую функцию (и вернуть значение вызыающей функции)

    А если ничего не указать?Она будет в памяти висеть или что?
    С 1998 года она выполнит return 0 (опять же, справедливо только для main() ) как только достигнет конца функции main().
    Т.е. если указываешь 0, то это типа false.
    Это EXIT_SUCCESS.
    А если указать 1?
    Implementation defined. Обычно работает так же как и EXIT_FAILURE.

    Фактически это код выхода. Он возвращается в ОС. Если программа была запущена из командной строки этот код выхода можно проверить чтобы узнать как была завершена программа.
    Ответ написан
    1 комментарий
  • Не работает input type="text". что делать?

    alexey-m-ukolov
    @alexey-m-ukolov Куратор тега HTML
    Верхний инпут перекрывает margin нижнего (email). Просто так это не исправить, тут всё надо переделывать на нормальную вёрстку.
    Ответ написан
    2 комментария
  • Как исправить ошибку при подключении БД Access к PHP?

    ThunderCat
    @ThunderCat Куратор тега PHP
    {PHP, MySql, HTML, JS, CSS} developer
    Вроде ODBC не предназначен для аксеса, везде рекомендуют использовать пдо. Либо ставить руками поддержку аксеса, что скорее всего в любом случае понадобится.
    https://stackoverflow.com/questions/2222684/connec...
    https://stackoverflow.com/questions/19807081/how-t...

    Так же, что нужно для доступа к аксесу как источнику (там про мс скуель, но драйверы будут одинаковые нужны и для пыха):
    https://learn.microsoft.com/ru-ru/sql/integration-...

    PS: Все еще не понимаю назачем издеваться над собой, не легче экспортировать базу во что-то живое?
    Ответ написан
    2 комментария
  • Как исправить ошибку при подключении БД Access к PHP?

    @rPman
    А если не использовать dsn а указать в настройках подключения путь до файла базы?
    p.s. https://www.php.net/manual/en/odbc.installation.php
    spoiler
    To avoid «[Microsoft][ODBC Driver Manager] Data source name not found and no default driver specified»:

    - Find the ODBC manager in Windows control panel and check the "Drivers" tab. Please note that 64 bit Windows has two different managers for 32 [1] and 64 bit drivers: drivers must match your PHP installation.

    - If the required driver doesn't show up there, you need to install it. The free "Microsoft Access Database Engine 2010 Redistributable" package [2] is one of the possibilities for Access and Excel.

    - When connecting with odbc_connect(), make sure you are using the exact driver name in the DRIVER parameter: 'Microsoft Access Driver (*.mdb)' will not work if your driver is called 'Microsoft Access Driver (*.mdb, *.accdb)'.

    [1] C:\Windows\SysWOW64\odbcad32.exe
    [2] www.microsoft.com/en-us/download/details.aspx?id=13255
    Ответ написан
    Комментировать
  • Почему псевдокласс invalid изменяет состояние input по дефолту?

    Rsa97
    @Rsa97
    Для правильного вопроса надо знать половину ответа
    У вас стоит required, соответственно незаполненное поле имеет статус invalid. Для определения непустого поля можно использовать &:not(:placeholder-shown):invalid
    Ответ написан
    Комментировать
  • Как подключить базу данных Access к PHP?

    delphinpro
    @delphinpro Куратор тега PHP
    frontend developer
    https://www.php.net/manual/ru/odbc.installation.php

    Пользователи Windows должны включить php_odbc.dll, чтобы использовать этот модуль.
    Ответ написан
    Комментировать
  • Как убрать знаки препинания в value и получить количество слов?

    @EvolveSunVolt
    Чтобы убрать знаки препинания из строки и посчитать количество слов, можно использовать регулярное выражение в методе replace(), которое заменит все знаки препинания на пробелы, а затем воспользоваться методом split() для разделения строки на массив слов. Вот пример кода:

    const input = document.querySelector('textarea');
    const text = input.value;
    const regex = /[^\w\s]|_/g; // регулярное выражение, которое находит все знаки препинания
    const sanitizedText = text.replace(regex, ' '); // заменяем знаки препинания на пробелы
    const words = sanitizedText.trim().split(/\s+/); // разделяем строку на массив слов
    const wordCount = words.length; // получаем количество слов
    console.log(wordCount);


    Здесь мы используем регулярное выражение [^\w\s]|_ для поиска всех знаков препинания и символов подчеркивания. Знак ^ в квадратных скобках означает "не", то есть мы ищем все символы, которые не являются буквами или пробелами. Затем мы используем метод replace() для замены всех найденных символов на пробелы. Затем мы используем метод trim() для удаления лишних пробелов в начале и конце строки, а метод split(/\s+/) для разделения строки на массив слов по одному или нескольким пробелам. Наконец, мы получаем количество слов в массиве с помощью свойства length и выводим результат в консоль.
    Ответ написан
    Комментировать
  • Как вывести дату в формате ISO 8601 без времени?

    nedosekinstanislav
    @nedosekinstanislav
    Штирлиц как никогда был близок к провалу
    let today = new Date('05 October 2011');
    let isoDate = today.toISOString().slice(0, 10);
    console.log(isoDate);
    Ответ написан
    1 комментарий
  • Почему при отправке данных на почте пустые сроки?

    ThunderCat
    @ThunderCat Куратор тега PHP
    {PHP, MySql, HTML, JS, CSS} developer
    Вариантов, собсно, 2:
    1) Не туда
    2) Не так

    В первом случае убедитесь что вы отправляете данные на нужный роут. Вероятность не большая, но есть.

    Во втором случае достаточно проверить в каком формате вы отправляете данные, и какие данные приходят. Формат отправки можно посмотреть в нетворке, а в коде первыми строками проверить что приходит в $_POST - var_dump($_POST);exit(); Возможно (и похоже на то) что вы отправляете форму аяксом, а данные передаете в теле как жсон например. Естественно, при этом ловить что либо в пост переменных бесполезно ), тут нужно будет щупать php://input
    Ответ написан
    4 комментария
  • Какие блоки использовать для указанных блоков?

    Ugolnikovvv
    @Ugolnikovvv
    Junior Frontend-разработчик
    63b4722b4fa9c713549366.png
    Ответ написан
    Комментировать
  • Можно ли переделать стиль треугольника в textarea?

    iiiBird
    @iiiBird Куратор тега CSS
    Пока ты спишь - твой конкурент совершенствуется
    сделай обертку и сделай ей after абсолютом в этот угол. и раскрашивай как душе угодно
    p.s. pointer-events: none; не забудь этому after, чтобы хвататься за угол textarea, а не after
    Ответ написан
    Комментировать
  • Как сделать красивое закрытие выдвигающегося меню?

    twobomb
    @twobomb
    Возможно нужно поменять в .btn-menu span {
    transition: all .1s linear .23s;
    на
    transition: all .1s linear;
    Ответ написан
    1 комментарий
  • Почему main все игнорирует?

    SPART4K
    @SPART4K
    Middle Front-end Developer (Vue.js/Nuxt.js)
    У вас div box не закрыт
    Советую пользоватеться IDE ( Текстовым редактором ) чтобы проще было следить за этим
    Или https://involta.ru/tools/validator-html/
    spoiler

    <html lang="ru">
        <head>
            <title>МЯСНОЙ ДАР</title>
            <meta charset="UTF-8">
    
            <link rel="preconnect" href="https://fonts.googleapis.com">
            <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
            <link href="https://fonts.googleapis.com/css2?family=Fira+Sans+Extra+Condensed:wght@500&display=swap" rel="stylesheet">
    
            <link rel="stylesheet" href="style.css">
    
            <link rel="shortcut icon" href="images/xphoto.png" type="image/x-icon">
        </head>
    
        <body>
                <header>
                    <div class="HeaderContainer">
                        <div class="logo"> <img src="images/logo.png" alt=""> </div>
                            <a href="#" class="item photo"><img src="images/phone.png" alt="" width="45" height="45"></a>
                            <a href="#" class="item anim">КОМПАНИЯ</a>
                            <a href="#" class="item anim">ПРОДУКЦИЯ</a>
                            <a href="#" class="item anim">КЛИЕНТАМ</a>
                            <a href="#" class="item anim">КОНТАКТЫ</a>
                            <a href="#" class="item photo"><img src="images/poloski.png" alt="" width="45" height="40"></a>
                      </div>
                </header>
        
                <main>
                    <div class="container"> <!-- container начало -->
                        <div class="box">
                            <div class="slider middle"><!-- Слайдео начало -->
    
                                <div class="slides">
                    
                                    <input type="radio" name="r" id="r1" checked>
                                    <input type="radio" name="r" id="r2">
                                    <input type="radio" name="r" id="r3">
                                    <input type="radio" name="r" id="r4">
                    
                                    <div class="slide s1"><img src="images/longkolbas.png" alt></div>
                                    <div class="slide"><img src="images/kolbasa2.png" alt></div>
                                    <div class="slide"><img src="images/kolbasa3.png" alt></div>
                                    <div class="slide"><img src="images/kolbasa4.png" alt></div>
                    
                                </div>
                    
                                <div class="navigation">
                    
                                    <label for="r1" class="bar"> </label>
                                    <label for="r2" class="bar"> </label>
                                    <label for="r3" class="bar"> </label>
                                    <label for="r4" class="bar"> </label>
                                    
                                </div>
                            </div><!-- Сладйер конец -->
                        </div> <!-- вот закрытый box -->
                    </div><!-- container конец -->
                </main>
        
                <footer class="container">  
                    <a>это футер</a>
                </footer>
        </body>
    </html>

    Ответ написан
    Комментировать
  • Как сделать чтобы при нажатии на кнопку открывался только один элемент, а не все?

    0xD34F
    @0xD34F Куратор тега JavaScript
    Сразу определим селекторы элементов и класс, они нам дальше понадобятся:

    const blockSelector = 'селектор блоков';
    const buttonSelector = 'селектор кнопок';
    const activeClass = 'класс, показывающий блок';

    Класс надо переключать не у всех блоков сразу, а у того, который соответствует нажатой кнопке. Как определить, какой блок нужен? Можно просто по индексу. Нажали третью кнопку - нужен третий блок. Как узнать индекс кнопки? Например, он передаётся в коллбек метода forEach. Т.е., в список параметров внешнего forEach добавляем индекс, и вместо внутреннего forEach выполняем обращение к соответствующему элементу коллекции блоков:

    const blocks = document.querySelectorAll(blockSelector);
    const buttons = document.querySelectorAll(buttonSelector);
    
    buttons.forEach((n, i) => {
      n.addEventListener('click', () => {
        blocks[i].classList.toggle(activeClass);
      });
    });

    Кстати, создавать отдельные обработчики клика для каждой из кнопок не обязательно, можно сделать один общий. Как при этом получать индексы? - их можно прицепить прямо к кнопкам. Например, в виде data-атрибута:

    const onClick = function({ currentTarget: { dataset: { index } } }) {
      this[index].classList.toggle(activeClass);
    }.bind(document.querySelectorAll(blockSelector));
    
    document.querySelectorAll(buttonSelector).forEach((n, i) => {
      n.dataset.index = i;
      n.addEventListener('click', onClick);
    });

    Также есть вариант вычислять индекс при клике:

    const blocks = document.querySelectorAll(blockSelector);
    const buttons = document.querySelectorAll(buttonSelector);
    
    buttons.forEach(n => n.addEventListener('click', onClick));
    
    function onClick() {
      const index = Array.prototype.indexOf.call(buttons, this);
      blocks[index].classList.toggle(activeClass);
    }

    А вообще, если у каждой из пар кнопка-блок есть отдельный общий предок (const containerSelector = '...';), то индексы не нужны. Достаточно от нажатой кнопки подняться до общего предка кнопки и блока, и найти внутри блок (а можно даже и не искать, если добавлять класс контейнеру; конечно, стили придётся в этом случае немного изменить, вместо .блок.класс будет .контейнер.класс .блок):

    const toggleBlock = button => button
      ?.closest(containerSelector)
      ?.querySelector(blockSelector)
      .classList
      .toggle(activeClass);
    
    
    // можно добавить обработчик клика каждой кнопке индивидуально
    document.querySelectorAll(buttonSelector).forEach(function(n) {
      n.addEventListener('click', this);
    }, e => toggleBlock(e.currentTarget));
    
    // или один раз на всю страницу
    document.addEventListener('click', e => {
      toggleBlock(e.target.closest(buttonSelector));
    });
    Ответ написан
    Комментировать
  • Как запретить уход вправо у слайдера?

    @7rows
    Frontend Разработчик / Vue / JS / TS / CSS
    btnNext.disabled = position === (itemsCount - 1);
    Как-то так, этот код отработает тогда, когда у вас последний элемент будет равен позиции
    Ответ написан
    Комментировать