Чтобы изменить размер элемента в JavaScript при изменении ширины пользовательской страницы, вы можете использовать несколько методов. Вот несколько подходов:

1. Прослушиватель событий изменения размера окна: добавьте прослушиватель событий к объекту окна, который срабатывает при каждом изменении размера окна. В функции обработчика событий вы можете обновить размер элемента в зависимости от новой ширины.

window.addEventListener('resize', function() {
  // Update element size here
});

2. Медиа-запросы CSS. Определите разные стили CSS для страниц разной ширины с помощью медиа-запросов. Затем вы можете применить эти стили к элементу, чтобы соответствующим образом изменить его размер.

/* Example media query */
@media (max-width: 768px) {
  .my-element {
    /* CSS rules for smaller page width */
  }
}

3. CSS Flexbox или Grid: используйте CSS Flexbox или Grid для создания адаптивного дизайна. Настраивая свойства флексбокса или сетки, вы можете управлять размером и расположением элемента в зависимости от доступного пространства.

4. Преобразования CSS. Используйте преобразования CSS, такие как масштабирование или перемещение, для динамического изменения размера элемента в зависимости от изменений ширины страницы. Вы можете применить эти преобразования с помощью JavaScript при изменении размера окна.

window.addEventListener('resize', function() {
  var width = window.innerWidth;
  // Calculate new size based on width
  // Apply CSS transform to resize element
});

Это всего лишь несколько способов изменить размер элемента в JavaScript при изменении пользовательской ширины страницы. Не забудьте выбрать подходящий метод в зависимости от ваших конкретных требований и структуры вашего кода.