عندما تقوم ببناء واجهة مستخدم في المتصفح ، قد يكون لديك عنصر يمكن تمريره ، ومن الضروري معرفة التمرير الأفقي والعمودي الموجود حاليًا.
كيف يمكنك فعل ذلك؟
بمجرد حصولك على العنصر ، يمكنك فحصهscrollLeftوscrollTopملكيات.
ال0, 0يوجد الموضع دائمًا في الزاوية اليسرى العليا ، لذا فإن أي تمرير يكون مرتبطًا بذلك.
مثال:
const container = document.querySelector('. container')
container.scrollTop
container.scrollLeft
هذه الخصائص هي قراءة / كتابة ، لذلك يمكنك أيضًاتعيينموضع التمرير:
const container = document.querySelector('. container')
container.scrollTop = 1000
container.scrollLeft = 1000
تحميل مجانيدليل جافا سكريبت للمبتدئين
المزيد من دروس المتصفح:
- تتوفر بعض الحيل المفيدة في HTML5
- كيف أنشأت موقع ويب يستند إلى CMS يعمل دون اتصال بالإنترنت
- الدليل الكامل لتطبيقات الويب التقدمية
- واجهة برمجة تطبيقات الجلب
- دليل Push API
- واجهة برمجة تطبيقات Channel Messaging
- دروس عمال الخدمة
- دليل ذاكرة التخزين المؤقت API
- دليل API الإخطار
- الغوص في IndexedDB
- واجهة برمجة تطبيقات المحددات: querySelector و querySelectorAll
- تحميل JavaScript بكفاءة مع التأجيل وغير المتزامن
- نموذج كائن المستند (DOM)
- واجهة برمجة تطبيقات Web Storage: التخزين المحلي وتخزين الجلسة
- تعرف على كيفية عمل ملفات تعريف الارتباط HTTP
- واجهة برمجة تطبيقات التاريخ
- تنسيق صورة WebP
- طلب XMLHttpRequest (XHR)
- برنامج تعليمي متعمق SVG
- ما هي عناوين URL للبيانات
- خارطة الطريق لتعلم منصة الويب
- CORS ، تقاسم الموارد عبر الأصول
- عمال الويب
- دليل requestAnimationFrame ()
- ما هو النوع
- العمل مع DevTools Console وواجهة برمجة تطبيقات وحدة التحكم
- واجهة برمجة تطبيقات تركيب الكلام
- كيفية انتظار حدث جاهز لـ DOM في JavaScript عادي
- كيفية إضافة فئة إلى عنصر DOM
- كيفية تكرار عناصر DOM من querySelectorAll
- كيفية إزالة فئة من عنصر DOM
- كيفية التحقق من وجود فئة لعنصر DOM
- كيفية تغيير قيمة عقدة DOM
- كيفية إضافة حدث نقرة إلى قائمة عناصر DOM التي تم إرجاعها من querySelectorAll
- WebRTC ، واجهة برمجة تطبيقات الويب في الوقت الفعلي
- كيفية الحصول على موضع التمرير لعنصر في JavaScript
- كيفية استبدال عنصر DOM
- كيفية قبول الصور فقط في حقل ملف الإدخال
- لماذا تستخدم نسخة معاينة من المتصفح؟
- كائن النقطة
- كائن الملف
- كائن FileReader
- كائن FileList
- ArrayBuffer
- ArrayBufferView
- كائن URL
- صفائف من النوع
- كائن DataView
- واجهة برمجة تطبيقات BroadcastChannel
- واجهة برمجة تطبيقات Streams
- كائن FormData
- كائن المستكشف
- كيفية استخدام واجهة برمجة تطبيقات تحديد الموقع الجغرافي
- كيفية استخدام getUserMedia ()
- كيفية استخدام Drag and Drop API
- كيفية العمل مع التمرير على صفحات الويب
- التعامل مع النماذج في JavaScript
- أحداث لوحة المفاتيح
- أحداث الماوس
- أحداث اللمس
- كيفية إزالة جميع العناصر الأبناء من عنصر DOM
- كيفية إنشاء سمة HTML باستخدام Vanilla Javascript
- كيف تتحقق مما إذا كان مربع الاختيار محددًا باستخدام JavaScript؟
- كيفية النسخ إلى الحافظة باستخدام JavaScript
- كيفية تعطيل زر باستخدام JavaScript
- كيفية جعل صفحة قابلة للتحرير في المتصفح
- كيفية الحصول على قيم سلسلة الاستعلام في JavaScript باستخدام URLSearchParams
- كيفية إزالة جميع CSS من صفحة مرة واحدة
- كيفية استخدام insertAdjacentHTML
- سفاري ، حذر قبل الإقلاع عن التدخين
- كيفية إضافة صورة إلى DOM باستخدام JavaScript
- كيفية إعادة تعيين نموذج
- كيفية استخدام خطوط جوجل