జెక్కీవీ మొబైల్ లిస్ట్ కంటెంట్

jQuery Mobile జాబితా థంబ్‌నెయిల్

16x16px కంటే పెద్ద చిత్రాలకు, లింకులో <img> ఎలమెంట్లను జోడించండి.

jQuery Mobile స్వయంచాలకంగా చిత్రాలను 80x80px కి సరిపోలుస్తుంది:

ప్రతీయంతరం

<ul data-role="listview">
  <li><a href="#"><img src="chrome.png">

亲自试一试

సమాచారం కలిగిన జాబితాలను పూరించడానికి ప్రమాణపరమైన HTML వాడండి:

ప్రతీయంతరం

<ul data-role="listview">
  <li>
    <a href="#">
    <img src="chrome.png">
    <h2>గూగుల్ క్రోమ్</h2>
    <p>గూగుల్ క్రోమ్ ఉచిత మరియు ఆపెన్ సోర్స్ వెబ్ బ్రౌజర్. 2008 లో విడుదలైంది.</p>
    </a>
  </li>

亲自试一试

jQuery Mobile జాబితా ఐకాన్

మీ జాబితాకు 16x16px ఐకాన్లను జోడించడానికి <img> ఎలమెంట్లో class="ui-li-icon" అంశాన్ని జోడించండి:

ప్రతీయంతరం

<li><a href="#"><img src="us.png" alt="USA" class="ui-li-icon">USA</a></li>

亲自试一试

విభజన బటన్

వర్టికల్ విభజన జాబితాను సృష్టించడానికి <li> ఎలమెంట్లో రెండు లింకులను చొప్పండి:

jQuery Mobile రెండవ లింకుకు నీలి ఆర్క్ చిహ్నం స్టైల్స్ జోడిస్తుంది, సంకేతాన్ని మీరు స్క్రాల్ చేసినప్పుడు లింకులోని పదాలు (ఉన్నట్లయితే) చూపబడతాయి:

ప్రతీయంతరం

<ul data-role="listview">
  <li>
    <a href="#"><img src="chrome.png"></a>
    <a href="#">కొన్ని పదాలు</a>
  </li>

亲自试一试

పేజీలను మరియు డైలాగ్లను జోడించడం ద్వారా లింకుల ఫంక్షనలిటీని బలోపేతం చేయవచ్చు:

ప్రతీయంతరం

<ul data-role="listview">
  <li>
    <a href="#"><img src="chrome.png"></a>
    <a href="#download" data-rel="dialog">బ్రౌజర్ డౌన్లోడ్ చేయండి</a>
  </li>

亲自试一试

కొలత బ్యూఫ్

లిస్ట్ అంశాలకు సంబంధించిన సంఖ్యను చూపించడానికి కొలత బ్యూఫ్ వాడండి, ఉదాహరణకు మెయిల్ క్లాస్ లో సందేశాలు:

లిస్ట్ అంశాలకు సంబంధించిన సంఖ్యను చూపించడానికి కొలత బ్యూఫ్ వాడండి, ఉదాహరణకు <span> నియంత్రణలో ఉండే క్లాస్ "ui-li-count" అంశాన్ని సెట్ చేసి సంఖ్యను జోడించండి:

ప్రతీయంతరం

<ul data-role="listview">
  <li><a href="#">Inbox<span class="ui-li-count">335</span>
  <li><a href="#">Sent<span class="ui-li-count">123</span>
  <li><a href="#">Trash7

亲自试一试

注释：如需在计数泡泡中显示正确的数字，就必须进行程序化更新。我们将在下一章种讲解。

更多实例

更改列表项的默认链接图标
如何为列表项设置不同的链接图标（右箭头是默认的）。
可折叠列表
如何创建隐藏和显示内容的列表。
更多内容格式
如何制作日历。