jQuery Mobile কল্লেপবল

ঘুর্ণিত বিষয়গুলো

ঘুর্ণিত (Collapsibles) আপনাকে বিষয়কে লুকিয়ে রাখা বা প্রদর্শন করার অনুমতি দেয় - এটি কোনও বিষয়ের অংশকে সংরক্ষণ করার জন্য অত্যন্ত ব্যবহারিক

যদি আপনি ঘুর্ণিত বিষয়গুলোকে তৈরি করতে চান, তবে কোনও কান্ত্রীয়কে data-role="collapsible" এটি আপেক্ষা করুন। কান্ত্রীতে (div) একটি শিরোনাম উপাদান (h1-h6) যুক্ত করুন, এরপর আপনি কোনও হার্ডওয়্যার মার্কআপটি সম্প্রসারিত করতে চান:

উদাহরণ

<div data-role="collapsible">
  <h1>আমাকে ক্লিক করুন - আমি খুলতে পারি!</h1>
  <p>আমি ঘুর্ণিত বিষয়</p>
</div>

আপনি নিজেই চেষ্টা করুন

ডিফল্টে, এই বিষয়টি বন্ধ হয়ে আছে। যদি আপনি পৃষ্ঠা লোড করার সময় বিষয়টি খুলে দেওয়া হয়, তবে data-collapsed="false" ব্যবহার করুন:

উদাহরণ

<div data-role="collapsible" data-collapsed="false">
  <h1>আমাকে ক্লিক করুন - আমি খুলতে পারি!</h1>
  <p>এখন আমি ডিফল্টে খুলা হয়ে আছে。</p>
</div>

আপনি নিজেই চেষ্টা করুন

ঘুর্ণিত ক্রমবর্ধমান বলক

ক্রমবর্ধমান বিষয়গুলোকে ঘুর্ণিত করতে পারেন:

উদাহরণ

<div data-role="collapsible">
  <h1>আমাকে ক্লিক করুন - আমি খুলতে পারি!</h1>
  <p>আমি বিস্তৃত হওয়া বিষয়</p>
  <div data-role="collapsible">
    <h1>আমাকে ক্লিক করুন - আমি ঘুর্ণিত ক্রমবর্ধমান বলক!</h1>
    <p>আমি ঘুর্ণিত ক্রমবর্ধমান বলকের মধ্যে বিস্তৃত বিষয়</p>
  </div>
</div>

আপনি নিজেই চেষ্টা করুন

সুঝাওয়া:ক্রমবর্ধমান বিষয়গুলোকে আপনি চাইলে কতবারই নির্দিষ্ট পরিমাণে ঘুর্ণিত করতে পারেন。

ক্রমবর্ধমান সংকলন

ক্রমবর্ধমান সংকলন (Collapsible sets) হচ্ছে এমন ক্রমবর্ধমান বলকগুলো (সাধারণত হাওয়াইয়ার নামে পরিচিত) যা একসঙ্গে যুক্ত হয়েছে। যখন একটি নতুন বলককে খুলে দেওয়া হয়, তখন অন্য সব বলকগুলো বন্ধ হয়ে যায়。

কিছু বিষয় তৈরি করুন, এবং এই ক্রমবর্ধমান বলককে data-role="collapsible-set" দিয়ে নতুন কান্ত্রীয় প্যাকেজ বুক্কা করুন:

উদাহরণ

<div data-role="collapsible-set">
  <div data-role="collapsible">
    <h1>আমাকে ক্লিক করুন - আমি খুলতে পারি!</h1>
    <p>আমি বিস্তৃত হওয়া বিষয়</p>
  </div>
  <div data-role="collapsible">
    <h1>আমাকে ক্লিক করুন - আমি খুলতে পারি!</h1>
    <p>আমি বিস্তৃত হওয়া বিষয়</p>
  </div>
</div>

আপনি নিজেই চেষ্টা করুন

আরও ইনস্ট্যান্স

data-inset এট্রিবিউট দ্বারা গোলাকার কোণটি অপসারণ
collapsibles-এর কোনও গোলাকার কোণটি কিভাবে অপসারণ করা যায়。
data-mini দ্বারা collapsibles-কে ছোট করা
collapsibles-কে কিভাবে ছোট করা যায়。
data-collapsed-icon এবং data-expanded-icon দ্বারা আইকন পরিবর্তন
collapsibles-এর আইকনকে কিভাবে পরিবর্তন করা যায় (ডিফল্ট + এবং -)。