Позиционирование объекта относительно разных экрановJavascript

Форум по Javascript
Ответить
Anonymous
 Позиционирование объекта относительно разных экранов

Сообщение Anonymous »

В общем, суть заключается в следующем: на одном экране мы собираем изображения в массив, распознаем координаты (касание) относительно экрана (в процентах), а затем в типе = 2 мы узнаем Pixel Значения относительно этих процентов. Тем не менее, проценты отображаются в консоли. Log, все в порядке, но по какой-то причине все создается в верхнем левом углу, как будто проценты используются вместо пикселей. < /P>
i 'уже спамил несколько чатпт, они не могут мне каким -либо образом помочь = (< /p>
function addImage(touch, type, selectedImage) {

let width = 125;
let scale = "scale(0.5)";
let offset = width / 2;
let clientX = touch.clientX;
let clientY = touch.clientY;

let touchBlock = document.getElementById('touchBlock');
let blockRect = touchBlock.getBoundingClientRect(); // Получаем размеры и позицию touchBlock
let blockWidth = blockRect.width;
let blockHeight = blockRect.height;
let targetScreenWidth = window.innerWidth;
let targetScreenHeight = window.innerHeight;
let calculatedX = clientX - blockRect.left; // Пересчет координат относительно touchBlock
let calculatedY = clientY - blockRect.top; // Пересчет координат относительно touchBlock

let xPercent = blockWidth > 0 ? (calculatedX / blockWidth) * 100 : 0;
let yPercent = blockHeight > 0 ? (calculatedY / blockHeight) * 100 : 0;

let xPercentz;
let yPercentz;
if (type == 2) {
scale = "scale(0.7)";
offset = width / 2;
// Пересчет координат в проценты
xPercentz = xPercent;
yPercentz = yPercent;
// Пересчет процентов в пиксели относительно целевого устройства
calculatedX = (xPercentz / 100) * targetScreenWidth;
calculatedY = (yPercentz / 100) * targetScreenHeight;
console.log("targetScreenWidth: " + targetScreenWidth + " | x: " + xPercentz + " | y: " + yPercentz);
}
else {
// Для type == 1 просто сохраняем координаты в процентах
xPercentz = xPercent;
yPercentz = yPercent;
}

// Позиционируем изображение с учетом смещения
img.css({
'width': width + 'px',
'position': 'absolute',
'left': calculatedX - offset + 'px',
'top': calculatedY - offset + 'px',
'transition': 'all 1.5s',
'transform': scale
});

}
< /code>














Подробнее здесь: https://stackoverflow.com/questions/794 ... nt-screens
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Javascript»