سؤال

أنا أصنع لعبة جافا سكريبت تعتمد على المتصفح.على هذا النحو، لا يوجد داخل اللعبة أي مكان يحتاج المستخدمون فيه إلى نسخ/لصق النص.ومع ذلك، هناك العديد من الأماكن التي يحتاج المستخدم فيها إلى النقر والسحب لإجراء التحديدات في اللعبة.

يوجد داخل اللعبة العديد من الخلايا، داخليًا فقط خلايا جدول عادية، مع مساحة غير قابلة للكسر لمنعها من الانهيار في فايرفوكس (يمكنني إيقاف الانهيار في IE وSafari وOpera باستخدام CSS، ولكن لسبب ما لم ينجح الأمر في Firefox لذا لجأت إلى المسافات غير المنفصلة)، إما بلون خلفية خالص أو صورة خلفية.

عندما يقوم اللاعب بسحب التحديد عبرها، تقوم اللعبة بتمييز الخلايا عن طريق تغيير لون الخلفية.ومع ذلك، يقوم المتصفح أيضًا بتمييز المسافات غير المنفصلة، ​​مما يترك مستطيلات رمادية في بعض الخلايا.

يستخدم المتصفح أيضًا طريقة مختلفة لتحديد ما تم تحديده من اللعبة.

على سبيل المثالفي مربع 5 × 5، إذا اختار المستخدم (1، 1) إلى (3، 3)، تقوم اللعبة بتمييز الاختيار التالي:

|   |   |   |   |   |
|   | X | X | X |   |
|   | X | X | X |   |
|   | X | X | X |   |
|   |   |   |   |   |

لكن المتصفح يبرز المسافات غير الفاصلة فيما يلي:

|   |   |   |   |   |
|   |   | X | X | X |
| X | X | X | X | X |
| X | X | X | X |   |
|   |   |   |   |   |

هل هناك أي طريقة لإيقاف ظهور نمط اختيار المتصفح؟على الأقل في فايرفوكس وكروم، ولكن يفضل عبر المتصفحات.

هل كانت مفيدة؟

المحلول

بالنسبة لمتصفح فايرفوكس، يمكنك إضافة نمط CSS:(دليل موزيلا)

-moz-user-select: none

للكروم وسفاري:(لم اجد مصدر موثوق بعد)

-khtml-user-select:none

إذا كنت تفضل حل جافا سكريبت، فإليك الحل الذي وجدته من موقع الإجابة السابقة:

<div onselectstart="return false">some stuff</div>

نصائح أخرى

-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;

وتكرار من: https://stackoverflow.com/a/4407335/746491

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top