Bymas | Пожалуйста помогите кто знает js и сможет реализовать правильно задумку

Тема закрыта by

Причина: Всем спасибо за помощь и подсказки

Всем доброго времени суток, ребят помогите пожалуйста кому не сложно сделать нормально оформление блоков снаряжения.

Ниже ссылка на домен нажмите на манекен верхний там поймёте о чём идёт речь какой JS что делает.
Вот не могу я настроить блоки снаряжения как в низу на скриншоте при этом что бы JS работал весь день мучаюсь с этим.

Заранее благодарю за помощь и внимание.

Ссылка: https://vhoro.ru

Изображение

------

89876_1.png (384.8 Kb)
Скачиваний: 4

1. HTML

html

   <div class="character">   <img src="hero.png" class="hero">   <div id="equipment"></div> </div>

2. CSS

css

   .character {   position: relative;   width: 600px;   margin: auto; }  .hero {   width: 100%; }  .slot {   position: absolute;   width: 80px;   height: 80px;   border: 2px solid rgba(255,255,255,.5);   border-radius: 8px;   background-size: cover;   cursor: pointer; }

3. JavaScript (JSON)

javascript

   const slots = [   { id: "helmet", x: 260, y: 40, img: "helmet.png" },   { id: "weapon", x: 420, y: 180, img: "sword.png" },   { id: "shield", x: 100, y: 180, img: "shield.png" },   { id: "boots",  x: 260, y: 360, img: "boots.png" } ];

Генерация блоков (JavaScript)

javascript

   const equipment = document.getElementById("equipment");  slots.forEach(slot => {   const div = document.createElement("div");   div.className = "slot";   div.style.left = slot.x + "px";   div.style.top  = slot.y + "px";   div.style.backgroundImage = `url(${slot.img})`;    div.dataset.slot = slot.id;    div.onclick = () => {     alert("Слот: " + slot.id);   };    equipment.appendChild(div); });

chatgpt.com

vlddos , на нём и сделано больше всего, сам полный ноль в этой сфере ток учусь

Ramzesoff , спасибо большое по старому коду который был сделал теперь работает как и задумывал но не уверен что правильно написан код в выводе снаряжения и манекена ибо много style скорее всего в нём)

В общем сделал как сумел работает да и ладно)

WRUSH

(29 янв 2026, в 21:00)

Ramzesoff , спасибо большое по старому коду который был сделал теперь работает как и задумывал но не уверен что правильно написан код в выводе снаряжения и манекена ибо много style скорее всего в нём)

Может быть

Ramzesoff , ну для первого раза не плохо, потом вашу подсказку попробую так же сделать спасибо кстати за подсказки)

Ну как получилось я залил код на ссылку: https://vhoro.ru

Сейчас сюда файл залью для примера как делать а то тут на форуме искал гайд не нашёл вдруг так же потом новичку пригодиться