یلدا ادامه داره... ❤️ ۴۰ درصد تخفیف همه دوره‌ها

استفاده از تخفیف‌ها
ثانیه
دقیقه
ساعت
روز
Mesusjk
5 سال پیش توسط Mesusjk مطرح شد
2 پاسخ

متوجه نشدن کد

سلام. وقتتون بخیر. میخوام اول یه تشکر از شما بخاطر سایت خوبتون بکنم. سایت خیلی شیک و حرفه ای دارید. خیلی سریع به سوال های ما جواب میدید . معلومه که برای ما ارزش قائلید.
یه سوال توی این لینک داشتم: https://www.w۳schools.com/howto/tryit.asp?filename=tryhow_js_image_zoom
کمی درباره تابع moveLens مشکل دارم. اینکه داره مکان ماوس رو پیدا میکنه یا نمیزاره لنز از img بیرون بره رو میدونم. مشکلم اینه که متوجه نوع کد نویسیش نمیشم. منظورم اینه که چرا برنامه نویس این سایت ، از این روش و اون روش استفاده کرده و چطور فهمیده باید از این راه، این کار رو کرد؟
مثلا اینکه برنامه نویس این سایت چطور با استفاده از این کدهای زیر، مکان ماوس رو پیدا کرده؟

    x = pos.x - (lens.offsetWidth / ۲);
    y = pos.y - (lens.offsetHeight / ۲);

ممنون میشم اگه جواب بدید.


ثبت پرسش جدید
سینا شاه‌اویسی
تخصص : برنامه نویس فرانت اند
@sinashahoveisi 5 سال پیش مطرح شد
0

سلام ببین این که چطور به این کد ها رسیده همش با تمرین و فکر کردن درباره کدهاست و مهم تر از همه تسلطش روی کد های جاوااسکریپته.
lenz که تعریف کرده یه المنته و هر المنت تو جاوااسکریپت یه سری توابع تو خودشون دارن که از کلاس پدرشون به ارث بردن. حالا این div هم وقتی تعریف میشه به یه سری چیز ها دسترسی داره و میشه اونا رو تغییر داد و handle کرد. مثلا همین div میشه وقتی موس میره روش یا موس خارج میشه ازش یا .... هر چیز دیگه ایی که رو فهمید با استفاده از تابع addEventListener (از اسمش هم مشخصه که وقتی رخدادی اتفاق افتاد ) بعد داخلش دو تا پارامتر میگیره که یکیش نوع اتفاق("touchmove") و یکی دیگه callback function (که تو این مثال اسم تابع moveLens)، یعنی وقتی اون اتفاق رخ میده این تابع صدا زده بشه ( این کار خیلی تو جاوااسکریپت کار رایجیه) وقتی اون تابع صدا زده میشه این callback function یه پارامتر به عنوان ورودی میگیره ( که e تعریف کرده ) برای اون تابع میفرسته (این e رو تابع addEventListener پاس میده) حالا شما میتونی این e رو console.log بگیری ببینی چی توشه. وقتی این کارو میکنی میبینی همه چی رو بهت میده و تو فقط باید اسمشو ببینی چیه از جمله چیز هایی که در اختیارت میذاره pageX ایناس بعدش هم یکم محاسبات ریاضیه و تو باید با این ویژگی هایی که در اختیارت میذاره بهش برسی


میلاد-م
تخصص : توسعه‌دهنده رابط کاربری - Fron...
@milad 5 سال پیش مطرح شد
0

در گفتگوی دیگه ای از شما، توصیه کردم بیش از حد درگیر بخش محاسباتی و هندسی مسئله نشید. ولی اجازه بدین این بخش از کدهارو هم تشریح کنم براتون:

x و y در اینجا، قراره مکان قرارگیری عنصر لنز رو برای ما مشخص کنند. در واقع x و y مختصات گوشه ی بالایی-چپ از عنصر لنز رو که یک مربع هستش مشخص می کنند.
حالا چجوری محاسبه شده؟
متغیر pos در اینجا مکان اشاره گر ما رو نشون میده، ازونجایی که مکان اشاره گر در مرکز عنصر لنز واقع شده (وسط عرض و وسط ارتفاع)، پس برای اینکه مختصات نقطه ی گوشه ی بالایی-چپ رو بدست بیاریم، چه می کنیم؟
اگر از مختصات اشاره گر (pos.x) به اندازه نصف طول عنصر لنز (lens.offsetWidth / 2) کم کنیم، به ابتدای عنصر لنز (x) میرسیم (بهمین ترتیب محاسبه ی y نیز صورت گرفته).


برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید

ورود یا ثبت‌نام