يتم استخدام أشرطة التنقل المستجيبة عند استخدام bootstrap لإنشاء الخلفية. من بينها ، يتم استخدام المكون المنسدلة في كثير من الأحيان. كلما استخدمته أكثر ، كلما تحتاج إلى النقر. الافتراضات المنسدلة لتوسيع زر الماوس الأيسر. إذا كنت تستخدم الماوس لتوسيعه (تحوم) ، فسوف يوفر وقتًا للنقر ، مما قد يحسن الكفاءة.
فكرة التحول الأصلية هي: ربط حدث Hover بعنصر القائمة المنسدلة. عندما يرتفع التحوم ، قم بتنفيذ حدث النقر للعنصر - أي ، قم بمزامنة التحويم كنقرة ، ويتم النقر فوق النقر.
لكن التفكير في أنه بدلاً من إعادة عرضه بنفسك ، من الأفضل البحث عبر الإنترنت لمعرفة ما إذا كانت هناك أي ملحقات جاهزة. بالتأكيد ، لقد بحثت عنه وعنوان رمز مستضاف على Github: عرض
هنا ، فقط انسخ الرمز:
؛ (الوظيفة ($ ، نافذة ، غير محددة) {// خارج نطاق المكون الإضافي jQuery إلى // تتبع جميع Rolddownsvar $ AllDropDowns = $ () ؛ // إذا كانت الأمهات على الفور صحيحًا ، فسيتم ذلك على الفور // care element على الفور // parent $ alldropdowns = $ alldropdowns.add (this.parent ()) ؛ إرجاع هذا. دولار. {$ this.removeclass ('Open') ؛} ، Options.Delay) ؛}) ؛}) ؛}) ؛ $ ('[data-hover = "sropdown"]'). ROPDODNOVER () ؛}) (jQuery ، this) ؛يمكنك أن ترى أن المؤلف قد أضاف فاصلة فاصلة أمام المكون الإضافي ، مما يزيد من توافق المكون الإضافي ، لأنه قد لا يتم كتابة رمز JS السابق ؛ إذا لم تتم إضافة Semicolon هنا ، فقد يتسبب ذلك في خطأ JS لأنه لا يوجد كسر خط.
يدعم المكون الإضافي نقل بيانات العنصر HTML-* نقل المعلمة ، ويدعم أيضًا نقل معلمة التهيئة. فقط ضع رمز JS هذا خلف رمز JS الأصلي في Bootstrap.
ما سبق هو مقدمة المحرر لتغيير القائمة المنسدلة المنسدلة في Bootstrap لتحوم الزناد. آمل أن يكون ذلك مفيدًا للجميع. إذا كان لديك أي أسئلة ، فيرجى ترك رسالة لي وسوف يرد المحرر على الجميع في الوقت المناسب. شكرا جزيلا لدعمكم لموقع wulin.com!