যাইহোক, দ্রুত ক্লিক করার সময় ক্রোমে উপাদানগুলির ব্লু হাইলাইটিং রোধ করতে?

123

বেশিরভাগ সময় আমি এটি নিয়ে চিন্তিত হই না তবে আমার কাছে একটি চিত্রের কারাউসেল রয়েছে এবং আমি যদি পরবর্তী এবং পূর্ববর্তী ডিভগুলিতে দ্রুত ক্লিক করি তবে সেগুলি ক্রোমে হাইলাইট হবে।

আমি রূপরেখাটি ব্যবহার করার চেষ্টা করেছি: কিছুই নয় তবে কোনও প্রভাব নেই। সেখানে কি কোনও সমাধান আছে?

css google-chrome

— সেকরা
সূত্র

আমি বর্তমান ক্রোম সংস্করণে এই প্রভাবটি দেখতে পাচ্ছি না

— বিল্লাল বেগেরাদজ

আমি জানি যে আপনার ব্যবহারের কেসটি আলাদা, তবে অন্য যে কেউ এটিকে সমস্ত লিঙ্ক থেকে সরিয়ে নিতে চাইলে আমি এটি করার পরামর্শ দিই না। আমি এটি পিডব্লিউএতে অপসারণ করার চেষ্টা করেছি, তবে চাক্ষুষ প্রতিক্রিয়া ব্যতীত ব্যবহারকারীর উপলব্ধি হ'ল অ্যাপটি ধীর is

— কলিমার্কো

170

নির্বাচনটি "ক্লিয়ার" করতে জাভাস্ক্রিপ্ট ব্যবহার করে পাঠ্য নির্বাচন সাফ করে এমন ফ্লোরমিনের সরবরাহকৃত লিঙ্কটি ছাড়াও , আপনি এটি সম্পাদন করতে খাঁটি সিএসএসও ব্যবহার করতে পারেন। সিএসএস এখানে ...

.noSelect {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

class="noSelect"আপনি এই ক্লাসটি প্রয়োগ করতে চান সেই উপাদানটিতে কেবল গুণাবলী যুক্ত করুন । আমি এই সিএসএস সলিউশনটিকে একবার চেষ্টা করার পরামর্শ দিচ্ছি। জাভাস্ক্রিপ্ট ব্যবহার করে কোনও ভুল নেই, আমি কেবলমাত্র বিশ্বাস করি এটি সম্ভবত সম্ভাব্যতর হতে পারে এবং আপনার কোডগুলিতে কিছুটা পরিষ্কার করতে পারেন।

অ্যান্ড্রয়েড ক্রোমের -webkit-tap-highlight-color: transparent; জন্য একটি অতিরিক্ত নিয়ম যা আপনি অ্যান্ড্রয়েডে সমর্থনের জন্য পরীক্ষা করতে চাইতে পারেন।

— smts
সূত্র

1

কেবলমাত্র ক্রোমের জন্যই আপনার সম্ভবত কেবল প্রয়োজন user-selectএবং webkit-user-select।

— শ্রীযুক্ত করুন

আমি সমাধানটি নিয়ে যাচ্ছি যেহেতু আমার ক্রোমে কেবল হাইলাইট করার সমস্যা রয়েছে এবং এটি দুর্দান্ত কাজ করে। যারা অংশ নিয়েছেন তাদের সবাইকে ধন্যবাদ!

— স্মিথ

36

এন্ড্রয়েডে ক্রোম দিয়ে এটিকে কাজ করতে পারেনি। আমাকে ব্যবহার করতে হয়েছিল-webkit-tap-highlight-color: rgba(255, 255, 255, 0);

— ইওয়াজারু

25

-webkit-tap-highlight-color: transparent; ক্রোমের মূল অংশ

— ফিজনন

অ্যান্ড্রয়েড-ওয়েবেকিট-ট্যাপ-হাইলাইট-রঙে ক্রোমের জন্য: স্বচ্ছ; - আমার জন্য ধন্যবাদ ধন্যবাদ!

— সি কে মুন

213

অ্যান্ড্রয়েডে ক্রোমের জন্য, আপনি -উইবকিট-ট্যাপ-হাইলাইট-কালার সিএসএস সম্পত্তি ব্যবহার করতে পারেন :

-webkit-tap-হাইলাইট-রঙ হ'ল একটি স্ট্যান্ডার্ড সিএসএস বৈশিষ্ট্য যা ল্যাপটি টেপ হওয়ার সময় প্রদর্শিত হাইলাইটের রঙ সেট করে। হাইলাইটিংটি ব্যবহারকারীকে নির্দেশ দেয় যে তাদের ট্যাপটি সফলভাবে স্বীকৃত হয়েছে এবং তারা কোন উপাদানটিতে ট্যাপ করছে তা নির্দেশ করে।

হাইলাইটিং পুরোপুরি সরাতে, আপনি মানটি এখানে সেট করতে পারেন transparent:

-webkit-tap-highlight-color: transparent;

সচেতন হন যে এর অ্যাক্সেসযোগ্যতার উপর পরিণতি হতে পারে: আউটলিনেনোন ডট কম দেখুন

— Iwazaru
সূত্র

4

আমি দেখতে পেয়েছি যে আপনি উদাহরণস্বরূপ কোনও টাচস্ক্রিনে চালিত হলে, ক্রোম অ্যান্ড্রয়েডের মতোই আচরণ করবে। আমার কাছে একটি <ডিভি> ছিল যা যখনই আপনি এর ভিতরে কোথাও ক্লিক করেন তখন নীল ফ্ল্যাশ হয় would আমি যখন এই উত্তরটি ব্যবহার করেছি কেবল তখনই এটি বন্ধ হয়ে যায়। ধন্যবাদ!

— ভ্যালোরিয়াম

2

অন্য সিএসএস এ্যাটির কেউই এটি করবে না। এত গুরুত্বপূর্ণ যেহেতু ট্যাপ হাইলাইট করা আপনার ক্লিকের ফলে যা কিছু ক্লিক করা হয়েছে তার চেহারা বিকৃত করে, আপনার ভিজ্যুয়াল ভাষাটিকে ঝাপসা করে।

— ডোমিনিক সেরিসানো

23

-webkit-tap-highlight-color: transparent;মনে হয় কাজ করে।

— বার্নার্ড

1

আমি এটি পছন্দ করেছি, স্পর্শ ইভেন্টের জন্য এটি একটি আবশ্যক! এই তথ্যটির "চার্টের বাইরে" ব্যবহারযোগ্যতা রয়েছে!

— বার্কার ইয়াসিয়ার

1

এই সমাধানটি আমার জন্য 2020-এ কাজ করেছিল

— ব্লু বট

66

আমি ক্রোম সংস্করণ 60 চালাচ্ছি এবং পূর্ববর্তী CSS এর কোনও উত্তরই কাজ করেনি।

আমি দেখতে পেয়েছি যে outlineশৈলীর মাধ্যমে ক্রোম নীল হাইলাইট যুক্ত করছে । নিম্নলিখিত সিএসএস যুক্ত করা আমার জন্য এটি স্থির করে:

:focus {
    outline: none !important;
}

— জেফ এল।
সূত্র

5

আপনি, স্যার, একটি জীবন রক্ষাকারী।

— বেকাহ

2

এটি অ্যান্ড্রয়েডে ক্রোম (সংস্করণ 61) এর জন্য কাজ করছে

— স্টিফান

Chrome এর আরও সাম্প্রতিক সংস্করণের জন্য কাজ করে। ধন্যবাদ!

— ক্রেজড কোডার

সুপার, ভাবছিলেন যে কেন আমার বিশ্বস্ততা user-select:noneকোথাও পাচ্ছে না

— সান টি

আমি সবকিছু চেষ্টা করেছিলাম কিন্তু এটি মোহন এর মতো কাজ করে। আমার চুল বাঁচানোর জন্য ধন্যবাদ!

— অবিনাশ কুমার

25

তবে, কখনও কখনও, এমনকি সাথে user-selectএবং touch-calloutবন্ধ করাও cursor: pointer;এই প্রভাবের কারণ হতে পারে, সুতরাং, কেবল সেট করুন cursor: default;এবং এটি কার্যকর হবে।

— গুস্তাভো বি।
সূত্র

7

এটি একটি সঠিক উত্তর, cursor: pointer;প্রকৃতপক্ষে হাইলাইট ঘটায়। তবে -webkit-tap-highlight-color: transparent;এটি সর্বজনীন সমাধান।

— ইয়ানোট

1

@yanot: সম্পর্কে সতর্কবার্তা পড়া -webkit-tap-highlight-colorএটা লেবেল আগে একটি অপেক্ষাকৃত সার্বজনীন সমাধান : developer.mozilla.org/en-US/docs/Web/CSS/...

— হাসান বেগ

@ হাসানবাইগ আমি মনে করি এটা স্পষ্ট যে আমি সর্বজনীন ক্রস ব্রাউজারের অর্থ বোঝাতে চাইনি , তবে এই প্রসঙ্গে, যেমন ক্রোমের বিভিন্ন সংস্করণ জুড়ে

— ইয়ানট

2

ধন্যবাদ - অন্য কোনও সমাধান আমার পক্ষে কাজ করেনি। নীল হাইলাইটটি দূরে রাখতে কার্সার পয়েন্টারটি সরিয়ে ফেলতে হয়েছিল

— আরভিপি

3

cursor: defaultআর কিছুই কাজ না করে আমার জন্য কৌতুকটি করেছিলেন।

— টেলরিয়ান

-2

এই উপাদানগুলিতে নির্বাচন ইভেন্টের জন্য হ্যান্ডলার তৈরি করার চেষ্টা করুন এবং হ্যান্ডলারে আপনি নির্বাচনটি সাফ করতে পারেন।

এক নজর দেখে নাও:

জাভাস্ক্রিপ্ট সহ পাঠ্য নির্বাচন সাফ করুন

এটি নির্বাচন সাফ করার একটি উদাহরণ। আপনার কেবলমাত্র প্রয়োজনীয় নির্দিষ্ট উপাদানের উপর কাজ করার জন্য আপনাকে কেবল এটি সংশোধন করতে হবে।

— Floremin
সূত্র

সুতরাং এটি সিএসএস দ্বারা স্থির করা যাবে না, হাহ? আমি কি আমার ক্লিক হ্যান্ডলারের ভিতরে নির্বাচিত পাঠ্যটি সাফ করতে পারি? সম্পাদনা করুন - উদাহরণের জন্য ধন্যবাদ। এটি জাভাস্ক্রিপ্টের মাধ্যমে পরিচালনা করতে হবে যে স্তন্যপান। আমি আশা করছিলাম এটি কেবল একটি সিএসএস সমস্যা ছিল was

— স্মিথ

এছাড়াও, এটির কোনও অ্যাক্সেসযোগ্যতার প্রভাব থাকবে?

— স্মিথ

আপনি ক্লিক হ্যান্ডলারের পাঠ্যটি সাফ করতে পারেন, তবে খাঁটি সিএসএস সহ @ এসএমএসের উত্তরটি একবার দেখুন।

— ফ্লোরমিন

-8

এটি আমার পক্ষে সবচেয়ে ভাল কাজ করে:

.noSelect:hover {
  background-color: white;
}

— nagy.zsolt.hun
সূত্র

6

এটি খারাপ এবং নির্দিষ্ট ভবিষ্যতের জাহান্নামের পথ। কোন অপরাধ নেই.

— মাইক বারউইক

ওয়েবসাইটের পটভূমি সাদা না হলে কী হবে?

— রাইডন 88

এটি রক্ষণাবেক্ষণযোগ্য নয়। কেউ দয়া করে এটি করবেন না।

— টেলারিয়ান