background, а для загрузки статей по ajax, придется заморочиться созданием заглушки в виде красивых пустых строк, как на твоем скриншоте, которая заменится как только необходимые данные загрузятся. 
.header .active{ color: red; }
.main .active{ color: white;}
function delay(timeout) {
return new Promise(res => setTimeout(res, timeout));
}
async function sendMessage(user, message) {
/* example */
console.log(user, message);
/* example */
}
async function sendAllTheMessagesToOurLovelyUsers(mailing_data, delay_between_requests) {
for (let mailing_entry of Object.values(mailing_data)) {
for (let user of mailing_entry.users) {
await sendMessage(user, mailing_entry.msg);
await delay(delay_between_requests);
}
}
};
sendAllTheMessagesToOurLovelyUsers([
{
users: [
{ user_id: 25 },
{ user_id: 14 },
],
msg: "message1"
},
{
users: [
{ user_id: 14 },
{ user_id: 6 }
],
msg: "message2"
}
], 500);function delay(timeout) {
return new Promise(res => setTimeout(res, timeout));
}
async function sendMessage(user) {
/* example */
console.log(user);
/* example */
}
async function sendAllTheMessagesToOurLovelyUsers(user_lists, delay_between_requests) {
const users = {};
for (let user of user_lists.flat()) {
/* пример процедуры получения массива уникальных пользователей */
if (!(users[ user.user_id ] in users)) {
users[ user.user_id ] = user;
}
}
for (let user of Object.values(users)) {
await sendMessage(user);
await delay(delay_between_requests);
}
};
sendAllTheMessagesToOurLovelyUsers([
[
{ user_id: 25 },
{ user_id: 14 },
],
[
{ user_id: 14 },
{ user_id: 6 }
]
], 500);
document - текущий документ
getElementById() - метод получения элемента используя id
onchange - свойство элемента для обработчика события
function (event){} - анонимная функция (обработчик события)
event - локальная переменная в контексте анонимной функции
target - таргет он и в африке таргет (целевой элемент, где происходит туса)
parentNode - родительская нода
childNodes[1] - у родителя есть дети
data - у детей есть данные
slice(1) - отхренашить кусочек
currentKey - отхренашеный кусочек
let a = moment("2018-03-10", "YYYY-MM-DD"); // 1я дата (1й аргумент строковая дата, 2й аргумент формат даты)
let b = moment("2018-03-10", "YYYY-MM-DD"); // 2я дата
a.diff(b, 'days') // Разница в днях
// Либо так
moment.duration(a.diff(b)).asDays() // Разница в дняхvar setVal = proc => {
let {x, y} = document.querySelector('.vue-slider-process').getClientRects()[0];
let ev = document.createEvent("MouseEvent");
ev.initMouseEvent(
"click",
true, true,
window, null,
0, 0, x+(parseFloat((parseFloat(getComputedStyle(document.querySelector('.vue-slider-rail')).width.slice(0,-2))/100*proc).toFixed(1))), y,
false, false, false, false,
0, null
);
document.querySelector('.vue-slider-process').dispatchEvent(ev);
}