jQuery Mobile বাটন
- পূর্ববর্তী পৃষ্ঠা jQuery Mobile ট্রানজিশন
- পরবর্তী পৃষ্ঠা jQuery Mobile আইকন
মোবাইল অ্যাপ্লিকেশন টাচ অপারেশনের সুবিধা ওপর নির্মিত
jQuery Mobile-এ বাটন তৈরি করা
jQuery Mobile-এর বাটন তিনটি পদ্ধতিতে তৈরি করা যায়:
- <button> ইলেকট্রন ব্যবহার করা
- <input> ইলেকট্রন ব্যবহার করা
- data-role="button" ব্যবহার করে <a> ইলেকট্রন
<button>
<button>বাটন</button>
<input>
<input type="button" value="বাটন">
<a>
<a href="#" ডিটা-রোল="বাটন">বাটন</a>
সুঝাওয়া:jQuery Mobile-এর বাটনগুলি স্বচালিতভাবে স্টাইল পাবে, যা মোবাইল ডিভাইসের অন্তর্ভুক্ত করবে তাদের অন্তর্ভুক্তকরণকে এবং ব্যবহারিকতা বৃদ্ধি করবে। আমরা পৃষ্ঠা মধ্যে লিঙ্ক তৈরি করতে data-role="button" এর <a> ইলিমেন্ট ব্যবহার করার উপযোগী বলে মনে করি, এবং <input> বা <button> ইলিমেন্টকে ফর্ম সমর্থনের জন্য ব্যবহার করা হবে。
নেভিগেশন বাটন
পৃষ্ঠা লিঙ্ককরণ করতে বাটন ব্যবহার করতে, data-role="button" এর <a> ইলিমেন্ট ব্যবহার করুন:
ইনস্ট্যান্স
<a href="#pagetwo" ডিটা-রোল="বাটন">পৃষ্ঠা দুই গিয়ে যান</a>
ইনলাইন বাটন
ডিফল্ট অবস্থায়, বাটনগুলি সম্পূর্ণ স্ক্রিন প্রস্থ জুড়ে যায়। আপনি যদি বাটনকে তার কনটেন্টকে অনুসরণ করতে চান বা দুইটি বা আরও বেশি বাটনকে একসঙ্গে দেখাতে চান, তবে ডিটা-ইনলাইন="ট্রু" সংযোজন করুন:
ইনস্ট্যান্স
<a href="#pagetwo" data-role="button" ডিটা-ইনলাইন="ট্রু">পৃষ্ঠা দুই গিয়ে যান</a>
গ্রুপবদ্ধ বাটন
jQuery Mobile বাটনগুলিকে গ্রুপ করার একটি সহজ পদ্ধতি প্রদান করে。
ডিটা-রোল="কন্ট্রোলগ্রুপ" বৈশিষ্ট্য এবং ডিটা-টাইপ="হোরাইজন্টাল|ভার্টিক্যাল" সঙ্গে একসঙ্গে ব্যবহার করে, বাটনগুলিকে হোরাইজন্টাল বা ভার্টিক্যাল ভাবে গ্রুপ করার জন্য প্রয়োগ করুন:
ইনস্ট্যান্স
<divডিটা-রোল="কন্ট্রোলগ্রুপ"ডিটা-টাইপ="হোরাইজন্টাল"> <a href="#anylink" data-role="button">বাটন ১</a> <a href="#anylink" data-role="button">বাটন ২</a> <a href="#anylink" data-role="button">বাটন ৩</a> </div>
সুঝাওয়া:ডিফল্ট অবস্থায়, কম্বো বাটনগুলি ভিক্টিকল ভাবে গ্রুপ করা হয়, যারা পরস্পরের মধ্যে কোনো বাহ্যিক মার্গব্যাপী কিংবা শুধুমাত্র শুরু ও শেষ বাটনগুলিতে কোনো গোলাকার আঙুল রয়েছে। এরফলে, সুন্দর দৃশ্যকুল তৈরি হয়。
ফিরে যাওয়া বাটন
ফিরে যাওয়া বাটন তৈরি করতে, ডিটা-রেল="ব্যাক" বৈশিষ্ট্য ব্যবহার করুন (অ্যানচরের হ্রেফ মানটি অবহেলা করা হবে):
ইনস্ট্যান্স
<a href="#" data-role="button" ডিটা-রেল="ব্যাক">ফিরে যান</a>
আরও বেশি মুক্তিযোগ্য ডিটা-এস বৈশিষ্ট্য
| বৈশিষ্ট্য | মূল্য | বর্ণনা | ইনস্ট্যান্স |
|---|---|---|---|
| data-corners | true | false | বাটনে আঙুল থাকে কিনা নির্ধারণ করুন | টেস্ট |
| data-mini | true | false | ছোট বাটন হয় কিনা নির্ধারণ করুন | টেস্ট |
| data-shadow | true | false | বাটনে ছায়া থাকে কিনা নির্ধারণ করুন | টেস্ট |
jQuery Mobile data-* এট্রিবিউটের সমস্ত তথ্য জানতে, আমাদের jQuery Mobile Data এট্রিবিউট রেফারেন্স ম্যানুয়েল。
বাটনে আইকন যোগ করার জন্য কিভাবে দেখা যাবে প্রদর্শিত হয়
- পূর্ববর্তী পৃষ্ঠা jQuery Mobile ট্রানজিশন
- পরবর্তী পৃষ্ঠা jQuery Mobile আইকন
