PDA

View Full Version : پیدا کردن مختصات با کمک jqery



imangame
شنبه 18 آبان 1398, 18:08 عصر
با عرض سلام و خسته نباشید خدمت دوستان و سروران گرامی

سوالی داشتم در خصوص مختصات در jqery

فرض کنید ما یک تگ div داریم و با کمک css به آن پهنا و ارتفاع میدهیم و حال میخواهیم کاربر هر کجای صفحه که کلیک کرد اون div ما نیز حرکت کنه...

با تشکر

ASHKANLAEI
شنبه 18 آبان 1398, 20:43 عصر
این میشه؟
$("#divid").ofset(left: mouseX, top: mouseY);

imangame
یک شنبه 19 آبان 1398, 11:55 صبح
این میشه؟
$("#divid").ofset(left: mouseX, top: mouseY);
ممنون ولی کدهای زیر هم میشه امتحان کردم جواب داد.

window.addEventListener('click', function(event) {
var x = event.clientX
var y = event.clientY
var position = document.getElementById('main');
position.style.top = y + 'px';
position.style.left = x + 'px';
})

//$(document).click(function(event){
// console.log($(document).width())
// var x = event.clientX;
// var y = event.clientY;
// $('#main').css({
// top: y + 'px',
// left: x + 'px'
// })
//});
//

imangame
یک شنبه 19 آبان 1398, 11:56 صبح
سوال دومم در این خصوص اینه که چه جوری مختصات رو محاسبه کنیم که وقتی کلیک میکنیم روی گوشه های صفحه جسم ما نیم تنه نیفته در صفحه و کامل در صفحه بمونه...

ASHKANLAEI
یک شنبه 19 آبان 1398, 14:32 عصر
یک شرط قرار بدین که اگر مختصات ماوس + اندازه div تون بیشتر از اندازه صفحه بود div رو بجای ماوس به بیشترین مختصاتی ببره که بیرون از صفحه نمیفته.

imangame
یک شنبه 19 آبان 1398, 19:21 عصر
یک شرط قرار بدین که اگر مختصات ماوس + اندازه div تون بیشتر از اندازه صفحه بود div رو بجای ماوس به بیشترین مختصاتی ببره که بیرون از صفحه نمیفته.

بله میدونم بنده یکم در موضوع شرط ها ضعیف هستم برای همین نمیتونم شرط خوبی بنوسیم

مثلا اندازه width و height من 150px
شرط رو چه جوری بنویسم؟

plague
سه شنبه 21 آبان 1398, 18:45 عصر
مثلا سایز صفحت 500*500 هستش و سایز دیو متحرک هم 100*100 (عدد رند میدم که ساده بشه محاسبه )
حالا طرف کلیک کرد باید پیکسل اون کلیک کمتر از 400 باشه اگه بیشتر از 400 بود از باکس میفته بیرون

مثلا ارتفاع رو در نظر میگیریم شما اگه رو نقطه 450px صفحه کلیک کنی و top دیو رو برابر با اون نقطه قرار بدی از اونجایی که 100px ارتفاع دیو هستش مکان دیو میشه از نقطه 450px تا نقطه 550px و از اونجایی که صفحه ما کلا 500px ارتفاع داره این مقداریش میفته بیرون صفحه

به عبارت دیگه میگی که اگه y نقطه کلیک شده بیش از 400px بود ... همون 400px رو در نظر بگیر براش

ASHKANLAEI
چهارشنبه 22 آبان 1398, 10:37 صبح
<!DOCTYPE html><html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>JSKing</title>
<style>
.circle {
width: 200px;
height: 200px;
border-radius: 50%;
background: red;
position: absolute;
}
body, html {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<div class="circle"></div>
<script>
var main = function () {
var circle = document.querySelector(".circle");
document.body.addEventListener("click", function(event) {
bw = document.body.clientWidth;
bh = document.body.clientHeight;


w = circle.clientWidth;
h = circle.clientHeight;


circle.clientLeft = event.clientX + 'px';
circle.clientTop = event.clientY + 'px';


if (event.clientX + w > bw) {circle.clientLeft = bw - w + 'px';}
if (event.clientY + h > bh) {circle.clientTop = bh - h + 'px';}
});
}


main();
</script>
</body>
</html>

ASHKANLAEI
چهارشنبه 22 آبان 1398, 10:38 صبح
توی پاسخم از jquery استفاده نکردم.