কার্সার এবং পয়েন্টার

নন-টাচস্ক্রিন ডিভাইসে, আপনার ব্যবহারকারীরা কিসের সাথে ইন্টারঅ্যাক্ট করছে তা জানার জন্য কার্সার একটি অপরিহার্য উপায়। আপনি কীভাবে একটি উপাদানের সাথে ইন্টারঅ্যাক্ট করা যেতে পারে বা কীভাবে একটি ট্র্যাকপ্যাড বা মাউসের সাথে চলাচল আপনার সাইটের উপর প্রভাব ফেলবে সে সম্পর্কে দরকারী ইঙ্গিতও দিতে পারেন।

কার্সার

ব্রাউজারগুলি স্বয়ংক্রিয়ভাবে কার্সারগুলির জন্য কিছু সাধারণ ব্যবহারের ক্ষেত্রে পরিচালনা করে।

আপনি যদি এটি একটি কার্সার সহ একটি ডিভাইসে পড়ছেন, পৃষ্ঠাটি অন্বেষণ করুন৷ এটা সম্ভব যে আপনি আগে লক্ষ্য করেননি কিভাবে কার্সার পরিবর্তন হয়, কিন্তু এটি যে ইঙ্গিত দেয় তা নোট করুন। যখন আপনার পয়েন্টার পাঠ্যের উপর যায়, তখন কার্সার একটি নির্বাচন আই-বিমে পরিবর্তিত হয় যা প্রস্তাব করে যে আপনি পাঠ্য নির্বাচন করতে পারেন। আপনি যদি একটি লিঙ্কের উপর হোভার করেন, তাহলে কার্সারটি তর্জনী দিয়ে নির্দেশ করে একটি হাতের দিকে পরিবর্তিত হয়, যা আপনাকে একটি পদক্ষেপ নিতে পারে বলে পরামর্শ দেয়। অন্য সব জায়গায় একটি ডিফল্ট কার্সার থাকবে, যা প্রায়শই একটি তীর।

আপনি যত বেশি ইন্টারেক্টিভ সাইট তৈরি করবেন, আপনি কার্সারটি কাস্টমাইজ করতে চাইবেন যাতে ব্যবহারকারীরা ইন্টারঅ্যাকশনগুলি আরও সহজে বুঝতে পারে।

ব্রাউজারগুলি কার্সার সম্পত্তির জন্য বিভিন্ন কীওয়ার্ড সমর্থন করে যা টেনে আনা, আকার পরিবর্তন, নির্বাচন এবং আরও অনেক কিছুর জন্য ইঙ্গিত প্রদান করে।

যদি সমর্থিত কার্সারগুলির মধ্যে কোনটি একটি উপাদানের মিথস্ক্রিয়া যোগাযোগ না করে, তাহলে আপনি কার্সার হিসাবে ব্যবহার করার জন্য একটি SVG বা PNG ছবিও প্রদান করতে পারেন৷

ক্যারেটস

সম্পাদনাযোগ্য পাঠ্যে আপনার অবস্থান দেখানোর জন্য একটি সন্নিবেশ ক্যারেট ব্যবহার করা হয়। এটি আপনার কার্সার থেকে ভিন্ন, কারণ এটি আপনার মাউস অনুসরণ করে না। আপনি caret-color দিয়ে রঙ পরিবর্তন করতে পারেন।

একটি ব্যবহারকারীর পয়েন্টার ইনপুট প্রতিক্রিয়া

মাউস বা ট্র্যাকপ্যাড সহ ব্যবহারকারীরা টাচস্ক্রিন ব্যবহারকারীদের তুলনায় স্ক্রিনে আরও সুনির্দিষ্ট পয়েন্টের সাথে ইন্টারঅ্যাক্ট করতে সক্ষম। আপনি যদি শুধুমাত্র একটি মাউসের নির্ভুলতার জন্য ডিজাইন করেন, তাহলে টাচস্ক্রিন বা সূক্ষ্ম মোটর নিয়ন্ত্রণের সমস্যাযুক্ত ব্যবহারকারীরা তাদের প্রয়োজন অনুযায়ী আপনার পৃষ্ঠার সাথে যোগাযোগ করতে সক্ষম হবে না।

সাধারণ সমস্যাগুলি এমন বোতামগুলি অন্তর্ভুক্ত করে যা খুব ছোট বা ইন্টারেক্টিভ উপাদানগুলি একে অপরের খুব কাছাকাছি। এটি ব্যবহারকারীদের জন্য সঠিক উপাদানের সাথে ইন্টারঅ্যাক্ট করা কঠিন করে তোলে।

আপনার বোতাম এবং অন্যান্য ইন্টারেক্টিভ লক্ষ্যগুলি যথেষ্ট বড় তা নিশ্চিত করা আপনার সাইট অ্যাক্সেসযোগ্য তা নিশ্চিত করার একটি গুরুত্বপূর্ণ পদক্ষেপ। আপনি pointer এবং any-pointer মিডিয়া ক্যোয়ারী সহ ব্যবহারকারীর ইনপুট ডিভাইসের নির্ভুলতার উপর ভিত্তি করে আপনার শৈলীগুলি কাস্টমাইজ করতে পারেন।

pointer মিডিয়া বৈশিষ্ট্যটি ব্যবহারকারীর প্রাথমিক ইনপুট ডিভাইসকে নির্দেশ করে, যখন any-pointer সমস্ত ইনপুট ডিভাইসকে বোঝায়। আপনি fine সঙ্গে ইঁদুর মত ডিভাইস এবং coarse সঙ্গে টাচস্ক্রিন মত ডিভাইস মেলাতে পারেন. none মানই নির্দেশ করে যে ব্যবহারকারী একটি পয়েন্টার সহ একটি ইনপুট ডিভাইস ব্যবহার করছেন না।

পয়েন্টার এবং স্পর্শ ঘটনা

নির্দিষ্ট টাচস্ক্রিন অঙ্গভঙ্গি অক্ষম করা হচ্ছে

আপনি যখন একটি টাচস্ক্রিন ব্যবহার করেন, তখন ব্রাউজার কিছু সাধারণ অঙ্গভঙ্গি পরিচালনা করে। উদাহরণস্বরূপ, দুটি আঙুল দিয়ে স্ক্রীন স্পর্শ করা এবং সেগুলিকে আলাদা করে ছড়িয়ে দেওয়া সাধারণত সাইটে জুম ইন করে৷ যদিও আপনাকে আপনার সাইটে সেই আচরণগুলি প্রয়োগ করতে হবে না, আপনি কিছু ক্ষেত্রে সেই আচরণটি অক্ষম বা ওভাররাইড করতে চাইতে পারেন।

কিছু অ্যাকশন পরিচালনা করা ব্রাউজার থেকে অপ্ট আউট করতে, আপনি উপাদানটি পরিচালনা করতে চান এমন ক্রিয়াগুলির তালিকা করুন৷ pan-x এবং pan-y একক আঙুলের প্যানিং অঙ্গভঙ্গি সক্ষম করে৷ এগুলি pinch-zoom সাথে সক্রিয় করা যেতে পারে যা মাল্টি-আঙ্গুলের জুমিং এবং প্যানিং সক্ষম করে।

manipulation কীওয়ার্ডটি pan-x pan-y pinch-zoom সমতুল্য। manipulation অন্যান্য স্পর্শ আচরণগুলিকে বাদ দেয় যেগুলির জন্য অল্প সময়ের মধ্যে একাধিক স্পর্শের প্রয়োজন হয়, যেমন জুম করতে ডবল ট্যাপ৷

আপনি touch-action থেকে বাদ দিয়ে একটি ক্রিয়াটির ব্রাউজার পরিচালনা অক্ষম করার পরে, আপনি সেই ক্রিয়াটির জন্য পয়েন্টার ইভেন্ট সেট আপ করতে পারেন৷

সমস্ত ঘটনা এবং কর্ম নিষ্ক্রিয় করা হচ্ছে৷

কিছু ক্ষেত্রে, আপনি নির্দিষ্ট করতে চাইতে পারেন যে একটি উপাদান ইন্টারেক্টিভ নয়। pointer-events: none , উদাহরণস্বরূপ, আপনি বোতামটি ক্লিক করতে পারবেন না, বা এমনকি একটি হোভার স্টেট ট্রিগার করতে পারবেন না।

আপনার উপলব্ধি পরীক্ষা করুন