Арсений Матыцин

Вешать inrsectionObserver или по старинке ловить позиции, слушая скролл.

А запуск анимации можно реализовать как на JS (перебрать с цикле с приростом setTimeout), так и сменой класса, а задержку и анимацию описывать в CSS классе.

Вообще-то на CSS можно без проблем такое сделать. По пути наименьшего сопротивления → на гридах с параметром 1fr для шаблона по высоте. На флексбоксах тоже такое можно муткануть, но не так приятно, как на гридах.

А на JS надо брать размер элемента, можно сразу три, чтобы сравнивать и брать больший, а затем присваивать его всем в качестве min-height (иначе при перерасчетах он будет всегда фикс высоту выдавать).

Желательно это все завернуть в функцию, которую вызвать при инициации скрипта И запустить в вотчере события изменения размера окна.

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

А если надо, чтобы еще и по ссылке, да в истории браузера открывалось, тут сразу стоит коврять в сторону JS-фреймворков. Самостоятельно такое написать можно, не так уж и сложно, но нецелесообразно.

1. Если тебе надо сделать переводы сообщений на сайте, то Андрей тебе дал основной ключ в этом направлении — i18n. Хотя на самом деле ничто не мешает хранить объект с переводами, и самому набросать простенькую функцию перевода (ИМХО i18n раскрывает себя в ЯП, где происходит PO-пакетов).
2. А вот если тебе требуется динамический перевод с запросом в переводчик → милости просимс в любое API переводчика с запросами того, что необходимо перевести.

1. На выводе почти любой тег порежет лишние пробелы, исключеним будет <pre> к примеру.
2. А на вводе c JS (да и не только), такой вопрос уже был.

Ты можешь расположить на хостинге с PHP (бесплатном\платном, без разницы) файл с описанием действий и сослаться на него в своей форме в action.

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

$("#chater").load( url + ' #sections' );

Если верить документации, ты пропустил пробел, сформировав ссылку с якорем, вместо обращения к элементу с ID.

1. Использовать конструкцию if else.
2. Проверять входные условия.
3. В том условии, в котором ты попал возвращать false после инструкции выполнения.

У меня перегруженный пример есть, но с комментариями. Это то, что тебе нужно, я думаю.

function myFunctionmat() {
    console.log('Hello');
}

document.addEventListener('keypress', (e) => {
    if (e.which == 13) {
      myFunctionmat();
    }
});

Можно загонять данные при сборке Gulp-ом. Библиотеку не помню только.
Но при беглом гуглении нашел вот это.

В режиме же реального времени прорисовки браузером никак.

body → overflow: hidden.

Скорее всего ты хочешь получишь подписку на изменения переменной, это надо копать в сторону observer-ов.

Проще, если у тебя в коде точно есть место, где это переменная изменяется, тогда, тебе надо в стек загнать порядок действий, или функцию, в которой этот порядок будет описан.

Но лучше всего (без геморроя) тебе помогут JS-фреймворки типа Vue, в которых реактивность переменных уже описана за тебя.

Присмотрись к https://masonry.desandro.com/. Если сам тебе он не поможет, так хоть сырцы можешь глянуть и под себя логику загнать.

PS: есть лайфхак с columns, они для другого, поэтому, чтобы их применить придется изрядно повозиться и это скорее костыль.

https://developer.mozilla.org/ru/docs/Web/API/Docu...
https://developer.mozilla.org/ru/docs/Web/API/Wind...
https://developer.mozilla.org/en-US/docs/Web/API/W...

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

Раз ты билдишь через Vue, то через Vue и собирай билды для всех конфликтных страниц, чтобы исключить дублирование.

А если при текущей логике сборки это нереально, то можно попробовать переопределить имя пакета при его импорте в сборке вуя. Этот вариант я, по правде говоря, никогда и не пробовал, так как все такие конфликты решались первым подходом.

Bootstrap завязан на jQuery → а тот умеет делать так:

$(".clickelem").click(function (){
    $('html, body').animate({
        scrollTop: $("#tabname").offset().top
    }, 2000);
});

Лично мне больше импонирует VanillaJS, но она кушается не всеми браузерами:

window.scrollTo({
    top: [elem offset top],
    behavior: "smooth"
});