Ответы пользователя по тегу JavaScript
  • Какой самый простой способ шаблонизации html-страниц (js)?

    dimovich85
    @dimovich85 Куратор тега JavaScript
    https://u-academy.net/
    Никто не сказал про nunjucks)
    Ответ написан
    Комментировать
  • Как создают подобные сайты?

    dimovich85
    @dimovich85 Куратор тега CSS
    https://u-academy.net/
    WebGL, Three.js, Vertex & Fragment Shaders... + Canvas + mindblowing fantasy + analytics and math skills.
    Поищите на YouTube: Юра Артюх.
    Ответ написан
    Комментировать
  • Не получается соединить CSS к HTML, как сделать?

    dimovich85
    @dimovich85 Куратор тега CSS
    https://u-academy.net/
    Берете html, в тег head кидаете тег link, прописываете путь до файла стилей, то есть CSS, в атрибут href, указываете атрибут rel="stylesheet". В тег head, а лучше перед закрывающим тегом body пишете тег script, атрибут src передаете путь до JS и все)
    Ответ написан
    5 комментариев
  • Фильтр вывода записей в WordPress?

    dimovich85
    @dimovich85 Куратор тега JavaScript
    https://u-academy.net/
    Несколько вопросов, которые возникли по ходу дела:
    1) Вы подписались на хуки для ajax? Надо подписаться на два хука.
    2) Вы вместе с запросом должны передать еще один параметр, по-моему называется action, только не action из html в теге form, этот action отработает как слаг при вызове обработки ajax, на сервере.
    3) Вы проверили какой адрес получается в action, он правильный?
    4) Без preventDefault нет перезагрузки страницы? В js стоит обработка события submit, при этом стандартное действие браузера Вы не отменяете, по идее должна идти перезагрузка страницы.
    Ответ написан
    2 комментария
  • Как в jQuery отследить клик по кнопке disabled?

    dimovich85
    @dimovich85 Куратор тега JavaScript
    https://u-academy.net/
    Комментировать
  • Wordpress: как проигрывать и паузить видео по наведению курсора?

    dimovich85
    @dimovich85 Куратор тега JavaScript
    https://u-academy.net/
    WP не при чем.
    Пишете в js:
    let video = document.querySelector('video');
    video.addEventListener('mouseover', e=>{e.target.pause()});
    video.addEventListener('mouseout', e=>{e.target.play()});

    Что касается самого js, ищите в папке с темой.
    Ответ написан
    Комментировать
  • Почему данный код сработает?

    dimovich85
    @dimovich85 Куратор тега JavaScript
    https://u-academy.net/
    Да, ответ выше правильный, потому что без var или let. А вот после функций есть var a, то это объявление переменной поднимается вверх перед выполнением всего скрипта, но в а ничего не записывается, а запишет значение функция.
    Ответ написан
    Комментировать
  • Как создать тему для WordPress?

    dimovich85
    @dimovich85 Куратор тега CSS
    https://u-academy.net/
    Создать тему или "натянуть" верстку на CMS это вопрос не просто какого-то переноса разметки из одних файлов в другие. Часто это именно внедрение функционала, который отображается в макете.
    Например, если в шапке есть блок с номерами телефона, то надо предусмотреть, как из админки эти номера будут добавляться, и как их выводить. Если есть блок в макете "Свежие новости" с карточками статей, значит при создании темы надо как-то организовать сбор последних записей и потом их вывод. В этом плане WP имеет, конечно, готовые решения, но часто если брать их "из коробки", то и выводятся они с версткой, которую предусмотрели разработчики WP, иначе надо либо переделать свою верстку, либо вникать в то, как работает готовое решение и как-то его менять. Так что без PHP будет тяжело. Если ничего нестандартного не надо, то все достаточно просто.

    Тема WP состоит из стилей css, и файлов-шаблонов php, а также скрипта functions.php, который отвечает больше за функционал. Тему можно создать как с нуля, так и унаследоваться от какой-то готовой, и переопределить в ней шаблоны и стили.

    Главный файл темы, как ни странно, это style.css. Сначала в папке /wp-content/themes/ создаете новый каталог, в нем создаете файл style.css и в этот файл кидаете комментарий:
    /*
    Theme Name: Имя темы для админки
    Author: себя любимого сюда
    Text Domain: свои контакты для плюсиков в карму
    */

    Если хотите унаследоваться от другой темы надо добавить еще Template: и указать название темы, а точнее папки, где лежит тема.
    /*
    Theme Name: Имя темы для админки
    Author: себя любимого сюда
    Text Domain: свои контакты для плюсиков в карму
    Template: twentyseventeen
    */

    Дальше, если надо переопределить шаблон, просто в своей папке создаете файл с таким же названием, он будет взят в приоритете. Единственное, есть нюанс с functions.php, так как родительский исполняется перед Вашим.

    Работая с нуля, без наследования, надо еще добавить файлы index.php, header.php, footer.php и screenshot.png, он отобразиться в админке, как превью темы, последний, если не ошибаюсь, не обязательно. Файл header.php отвечает за вывод шапки, footer.php - подвала. index.php отвечает за все запросы, ЕСЛИ НЕТ более подходящего файла-шаблона. 404.php отвечает за 404 ошибку. page.php отвечает за вывод страницы (в WP можно создавать отдельные страницы), category.php за вывод страницы категорий, single.php за вывод одной записи и тд. Подробнее

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

    WP имеет систему виджетов и плагинов, которые значительно расширяют возможности движка. WP предлагает регистрацию своих таксономий, типов записей и всего такого прочего. Смотрите на сайте, который давал по ссылкам выше, а также давали выше в ответах ссылку на codex wprdpress.

    Насчет других CMS верно подметили, в каждой по своему, например в OpenCart используется шаблонизатор Twig, и сам движок написан по MVC, то есть функционал отделен от отображения, поэтому в нем легче править шаблоны, в них практически один html, WP похуже, тут все вперемешку с php.

    PS: создавая тему еще много есть тонкостей, например, чтобы подключить свои стили, свой js надо знать понятие хуков, и подключать скрипты и стили через вызов функций, которые в свою очередь должны подписаться на события, то есть хуки... Так что, wp не самый легкий вариант, если все эти понятия далеки от понимания, но зато есть статьи, видео, доки. Успехов!
    Ответ написан
    2 комментария
  • Как рассчитать высоты строк?

    dimovich85
    @dimovich85 Куратор тега JavaScript
    https://u-academy.net/
    Убиваете семантику и ограничиваете конечных пользователей в возможностях, которые дают таблицы, делаете интерфейс сложнее в доступе для лиц с ограниченными возможностями и усложняете себе жизнь.
    Рекомендую пообщаться с теми, кто ставит задачи и предложить все же таблицу сделать таблицей.
    Если все же вопрос стоит сделать так, как в вопросе, то берете родителя, проходитесь циклом по детям, берете высоту каждого ребенка и сравниваете с предыдущим, из двух чисел берете наибольшее и в конце получив макс число задаете его. Еще, флексбокс, по умолчанию, растягивает в строке блоки по высоте максимального, то есть задав дисплей флекс сразу получаете одним свойством все плюшки.

    Если интересно, чем таблица хороша, то во-первых она сама растянет строку по макс высоте, раз. Если таблицу выделить и скопировать, то потом можно ее вставить в excell, word, google sheets и куда угодно и вставится именно таблица, а непонятного вида текст, два. Экранные читалки когда видят таблицу помогают ее читать, table, tr, td помогают прочитать и навигировать по таблице не теряя смысл, три.
    Ответ написан
    Комментировать
  • Что делает оператор ?? в JS?

    dimovich85
    @dimovich85 Куратор тега JavaScript
    https://u-academy.net/
    В php такой есть)) В js по идее он вызывает SyntaxError)
    php.net/manual/ru/migration70.new-features.php
    Ответ написан
    Комментировать
  • Вопрос по функции .replace в JavaScript?

    dimovich85
    @dimovich85 Куратор тега JavaScript
    https://u-academy.net/
    Можно в шаблон wp вставить к тегу с картинкой, которая миниатюрная, data атрибут с адресом к той, что Вам надо. Через js повесить событие на эту картинку, и по клику или что там Вам надо читать data, где будет урл к большой картинке, и аяксом её грузить.
    Ответ написан
  • Как понять - import { Application } from 'backbone.marionette'?

    dimovich85
    @dimovich85 Куратор тега JavaScript
    https://u-academy.net/
    Расширение писать не обязательно, если этот файл .js
    Путь пишут, если это не node_modules, а Ваш файл, который Вы хотите импортировать, и как следствие, не известно, где он лежит.
    Если файл, который импортируете, находится в node_modules, то webpack найдет его сам.
    import {Aplication} это значит, что из файла экспортируется не один какой-то объект по умолчанию, и поэтому, когда Вы делаете импорт Вам надо указать, что именно Вы хотите импортировать из указаного модуля.
    Фигурные скобки - это деструктуризация: https://learn.javascript.ru/destructuring

    Вот, про систему модулей: https://learn.javascript.ru/modules
    Ответ написан
  • Slick slider - не адаптируется по ширине?

    dimovich85
    @dimovich85 Куратор тега CSS
    https://u-academy.net/
    Слик адаптируется не через css, а через настройки в js.
    kenwheeler.github.io/slick ищите в доках adaptive.
    Ответ написан
  • Что мы получаем, если img.clientHeight / 100 и img.clientWidth / 100?

    dimovich85
    @dimovich85 Куратор тега JavaScript
    https://u-academy.net/
    Высоту и ширину в процентах.
    Ответ написан
  • Почему говорят, что Javascript сделан на коленке?

    dimovich85
    @dimovich85 Куратор тега JavaScript
    https://u-academy.net/
    Дело в том, что "говорят", но как бы официально я доказательств не нашел.
    А еще, когда вдруг, спустя чуть ли не 10 лет, язык решили допилить, то поняли, что если выбросить все костыли, которые были в нем, то этим можно убить половину интернета, так как за десять лет все пользовались именно этими костылями. Поэтому, решили не переписать, а добавить. Так что в js все еще можно стрелять себе в ноги.
    Ответ написан
    Комментировать
  • Как определить клик по элементу div?

    dimovich85
    @dimovich85 Куратор тега JavaScript
    https://u-academy.net/
    ID.addEventListener('click', onClick);
    function onClick(event){
    // творим, че хотим
    let target = event.target;
    }
    Ответ написан
    Комментировать
  • Пишу свой первый калькулятор. Не могу понять, что я делаю не так?

    dimovich85
    @dimovich85 Куратор тега JavaScript
    https://u-academy.net/
    Никто событие клик не слушает. Помимо этого надо еще и с объектом события и с контекстом вызова разобраться.
    https://learn.javascript.ru/events-and-interfaces
    https://learn.javascript.ru/document
    Ответ написан
  • Как поставить в input ограничения?

    dimovich85
    @dimovich85 Куратор тега JavaScript
    https://u-academy.net/
    Ищите и читайте:
    HTML pattern
    RegExp
    Чтобы выводить что-то куда-то на input повесьте прослушку событий input или change, и по событию пишите что-то в другом div'е
    Ответ написан
    Комментировать