كيفية تحديد جهاز محمول باستخدام jQuery (أو JavaScript)؟

مرحبًا بالجميع! أنا مطور واجهات أمامية مبتدئ وواجهت مهمة: في الموقع أحتاج إلى عرض محتوى مختلف لمستخدمي الأجهزة المحمولة وأجهزة الكمبيوتر المكتبية. على سبيل المثال، على الهواتف أريد إزالة الرسوم المتحركة الثقيلة واستبدال قائمة سطح المكتب بـ "هامبرغر". المشكلة أنني لا أعرف كيفية تحديد ما إذا كان المستخدم قد دخل من هاتف أو جهاز لوحي بشكل صحيح. جربت التحقق من عرض النافذة عبر `$(window).width()`، لكن هذا غير موثوق — يمكن للمستخدم فتح الموقع على سطح المكتب في نافذة متصفح ضيقة، وعندها سيتم تفعيل النسخة المحمولة في مكان غير مناسب. أو العكس، على iPhone جديد بشاشة كبيرة قد يكون العرض أكبر من 1024px، وسيظهر الموقع كنسخة مكتبية. إليك مثال على الكود الخاص بي الذي لا يعمل كما ينبغي حاليًا: ```javascript $(document).ready(function() { if ($(window).width() < 768) { // عرض النسخة المحمولة $('.desktop-menu').hide(); $('.mobile-menu').show(); } else { // عرض النسخة المكتبية ```