jQuery Mobile পেজ

প্রোগ্রামিং

সুপারিশ:jQuery Mobile ব্যবহার করে প্রাথমিকভাবে

তবে যদি jQuery Mobile সমস্ত মোবাইল ডিভাইসের জন্য কাজ করে, তবে টেবিলেট কম্পিউটারেও এটা কম্প্যাটিবিলিটি প্রকল্প (কারণ সীমিত CSS3 সমর্থন) থাকতে পারে

প্রদত্ত

<body>
<div data-role="page">
  <div data-role="header">
    <h1>আপনাকে আমার হোমপেজ সফর করার জন্য স্বাগত জানাই</h1>
  </div>
  <div data-role="content">
    <p>আমি একজন মোবাইল ডেভেলপার!</p>
  </div>
  <div data-role="footer">
    <h1>ফুটার টেক্সট</h1>
  </div>
</div>
</body>

স্বয়ংক্রিয়ভাবে প্রয়াস করুন

উদাহরণ ব্যাখ্যা:

  • data-role="page" ব্রাউজারে দেখানো হয়
  • data-role="header" পৃষ্ঠার উপরের টুলবার তৈরি করে (সাধারণত শিরোনাম এবং সার্চ বাটনের জন্য ব্যবহৃত হয়)
  • data-role="content" পৃষ্ঠার কনটেন্টকে নির্দিষ্ট করে, যেমন টেক্সট, চিত্র, ফর্ম এবং বাটন ইত্যাদি
  • data-role="footer" পৃষ্ঠার নিচের টুলবার তৈরি করে

এই কন্টেন্টারগুলিতে, আপনি যে কোনও এইচটিএমএল ইলেমেন্ট যোগ করতে পারেন - অনুচ্ছেদ, চিত্র, শিরোনাম, তালিকা ইত্যাদি

সুপারিশ:HTML5 data-* অপেশনটি jQuery Mobile-এর মাধ্যমে মোবাইল ডিভাইসের জন্য "টাচফ্রেন্ডলি" ইন্টারএক্সচেঞ্জ প্রদর্শন তৈরি করতে ব্যবহৃত হয়

jQuery Mobile-এ পৃষ্ঠা যোগ করা

jQuery Mobile-এ, আপনি একটি একক HTML ফাইলে একাধিক পৃষ্ঠা তৈরি করতে পারেন

প্রত্যেক পৃষ্ঠাকে একটি অভিন্ন id-এর মাধ্যমে পৃথক করে, এবং href অপেশনটি একে অপরের সাথে সংযুক্ত করুন:

প্রদত্ত

<div data-role="page" id="pageone">
  <div data-role="content">
    <a href="#pagetwo">পৃষ্ঠা দুই তে যান</a>
  </div>
</div>
<div data-role="page" id="pagetwo">
  <div data-role="content">
    <a href="#pageone">পৃষ্ঠা একে গোচর করুন</a>
  </div>
</div>

স্বয়ংক্রিয়ভাবে প্রয়াস করুন

মন্তব্য:অনেক বেশি পরিমাণের কনটেন্ট ধারণকারী web অ্যাপলিকেশন লোড সময়কে প্রভাবিত করতে পারে (যেমন টেক্সট, লিঙ্ক, চিত্র এবং স্ক্রিপ্ট ইত্যাদি)।আপনি যদি অভ্যন্তরীণ লিঙ্ক পৃষ্ঠায় এটা নয় হয়, তবে বাহ্যিক ফাইল ব্যবহার করুন:

<a href="externalfile.html">বাহ্যিক পৃষ্ঠা তে যান</a>

পৃষ্ঠা কে ডায়ালগ হিসাবে ব্যবহার করা

ডায়ালগ একটি বিন্যাসপ্রণালীর উইন্ডো যা তথ্য দেখানোর জন্য ব্যবহৃত হয় বা ইনপুট নিতে চানো হয়

যদি আপনি যুক্তিসূত্রটির ক্লিক করলে (ক্লিক করা) একটি ডায়ালগ তৈরি করতে চান, তবে যুক্তিসূত্রটিতে data-rel="dialog" যুক্ত করুন:

প্রদত্ত

<div data-role="page" id="pageone">
  <div data-role="content">
    <a href="#pagetwo"> data-rel="dialog">পৃষ্ঠা দুইকে গোচর করুন</a>
  </div>
</div>
<div data-role="page" id="pagetwo">
  <div data-role="content">
    <a href="#pageone">পৃষ্ঠা একে গোচর করুন</a>
  </div>
</div>

স্বয়ংক্রিয়ভাবে প্রয়াস করুন