Не знаю зачем делать адаптацию, если можно сделать так
js.js (Добавил радар)
let health = document.getElementById('health');
let arm = document.getElementById('arm');
let cash = document.getElementById('cash');
cef.emit("game:hud:setComponentVisible", "interface", false);
cef.emit("game:hud:setComponentVisible", "radar", true);
cef.emit("game:data:pollPlayerStats", true, 50);
cef.on("game:data:playerStats", (hp, max_hp, arm, breath, wanted, weapon, ammo, max_ammo, money, speed) => {
health.value = hp;
arm.value = arm;
cash.innerHTML = divideNumberByPieces(money, ".");
function divideNumberByPieces(x, delimiter) {
return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, delimiter || " ");
}
});
style.css (Убрал фон, и сделал ХУД справа в углу, независимо какой у тебя размер экрана)
Например на ноутбуке у меня - худа не было видно
.container
{
display: block;
position: absolute;
right: 50px;
color: white;
font-family: TT Norms;
top: 50px;
}
.logo
{
background: url('logo.png');
height: 60px;
width: 112px;
}
.moneys a
{
width: 150px;
top: 2.5px;
left: 30px;
position: relative;
}
.moneys
{
height: 24px;
width: 24px;
background: url('money.png');
}
.health
{
top: 5px;
width: 24px;
height: 24px;
background: url('health.png');
position: relative;
}
.arm
{
width: 24px;
height: 24px;
top: 10px;
background: url('arm.png');
position: relative;
}
progress.styled
{
border-radius: 8px;
width: 100px;
height: 14px;
left:32px;
top:2.5px;
position: relative;
}
progress.styled::-webkit-progress-bar
{
background-color: rgb(82, 82, 82);
border-radius: 8px;
}
progress.styled::-webkit-progress-value
{
background-color: rgb(204, 62, 62);
background-image: linear-gradient(rgb(204, 62, 62), rgb(204, 62, 62));
border-radius: 8px;
}
progress.styled::-moz-progress-bar
{
background-color: rgb(204, 62, 62);
background-image: linear-gradient(rgb(204, 62, 62), rgb(204, 62, 62));
border-radius: 8px;
}
progress.arm
{
border-radius: 8px;
width: 100px;
height: 14px;
left: 32px;
top: 2.5px;
position: relative;
}
progress.arm::-webkit-progress-bar
{
background-color: rgb(82, 82, 82);
border-radius: 8px;
}
progress.arm::-webkit-progress-value
{
background-color: #287db3;
background-image: linear-gradient(#287db3, #287db3);
border-radius: 8px;
}
progress.arm::-moz-progress-bar
{
background-color: #287db3;
background-image: linear-gradient(#287db3, #287db3);
border-radius: 8px;
}
Сообщение отредактировал Pawn_Coder: 11 ноября 2021 - 20:36