প্ল্যাটফর্ম কন্ট্রোল বাতিল করার ডায়ালগ

কোনও মোডাল ডায়ালগ খোলা থাকলে, ব্যবহারকারীরা সেটি বন্ধ করার জন্য পরিচিত কন্ট্রোল ব্যবহার করতে চান: কীবোর্ডে Esc কী প্রেস করা, মোবাইল প্ল্যাটফর্মে ব্যাক বোতাম বা জেসচার ব্যবহার করা অথবা সহায়ক প্রযুক্তির মাধ্যমে বন্ধ করার জেসচার ব্যবহার করা।

<dialog> এলিমেন্ট প্রথমবার চালু করার সময়, এটি Esc কী দিয়ে বাতিল করা যেত, কিন্তু মোবাইলে ব্যাক বোতাম/জেসচারের মতো অন্যান্য প্ল্যাটফর্ম কন্ট্রোল দিয়ে বাতিল করা যেত না। <dialog> এলিমেন্টের জন্য closedby অ্যাট্রিবিউট যোগ করার সাথে সাথে, বন্ধ করার অনুরোধের জন্য আরও প্ল্যাটফর্ম-নির্দিষ্ট কন্ট্রোলে উত্তর দেওয়ার এক্সটেন্ডেড আচরণ <dialog> এলিমেন্টের জন্য প্রয়োগ করা হয়েছে যা মোডাল স্টেটে খোলা হয় (অর্থাৎ, JavaScript-এ <dialog> এলিমেন্টের showModal() মেথডের সাথে বা show-modal ইনভোকার কমান্ডের সাথে ডিক্লেরেটিভভাবে খোলা হলে)। তাই, ডেভেলপাররা আগে থেকেই <dialog> এলিমেন্ট ব্যবহার করলে তাদের কোনও নির্দিষ্ট পরিবর্তন করতে হবে না।

<!-- MANDATORY: must be opened with either `showModal()` with JavaScript or the `show-modal` command using declarative command invokers in order respond to close requests including platform-specific controls. -->
<dialog aria-labelledby="example">
  <h1 id="example">Example</h1>
  <p>Modal that can be dismissed with close requests.</p>
</dialog>

মডাল স্টেটে খোলা হলে, closedby অ্যাট্রিবিউট ছাড়া কোনও ডায়ালগ বন্ধ করার অনুরোধে ঠিক সেভাবেই সাড়া দেয় যেভাবে closedby অ্যাট্রিবিউটকে স্পষ্টভাবে closerequest-এ সেট করা হয়।

<!-- This is unnecessary as it is the default behavior for modal dialogs -->
<dialog closedby="closerequest" aria-labelledby="example">
  <h1 id="example">Example</h1>
  <p>Modal that can be dismissed with close requests.</p>
</dialog>

আপনি যদি "লাইট ডিসমিস" আচরণও চান, তাহলে আপনাকে অবশ্যই closedby থেকে any সেট করতে হবে:

<dialog closedby="any" aria-labelledby="example">
  <h1 id="example">Example</h1>
  <p>Modal that can be dismissed with close requests and light dismiss.</p>
</dialog>

ফলব্যাক স্ট্র্যাটেজি

মোডাল অবস্থায় খোলা <dialog>টি এলিমেন্ট আগে থেকেই Esc দিয়ে বাতিল করা যাবে, তাই কোনও ফলব্যাক প্রয়োজন নেই। মোবাইলের ব্যাক বোতাম/জেসচার থেকে বন্ধ করার অনুরোধ কার্যকর করার কোনও ভালো উপায় নেই, তাই এই ফিচারকে প্রোগ্রেসিভ এনহ্যান্সমেন্ট হিসেবে গ্রহণ করা সহজ, বিশেষ করে যখন মোডাল ডায়ালগ বাতিল করার অন্যান্য অন্তর্ভুক্তিমূলক উপায় আছে। একইভাবে, closedby="any" ব্যবহার করে <dialog> এলিমেন্টের জন্য লাইট ডিসমিস আচরণকে প্রোগ্রেসিভ এনহ্যান্সমেন্ট হিসেবে বিবেচনা করা যেতে পারে।