جی کوئی ام موبائل تولیبار

جی کوئی ام موبائل تولیبار

ਟੂਲਬਾਰ ਐਲੀਮੈਂਟ ਜ਼ਿਆਦਾਤਰ ਹੈੱਡਰ ਅਤੇ ਫੂਟਬਾਰ ਵਿੱਚ ਰੱਖੇ ਜਾਂਦੇ ਹਨ - "ਪਿਛਲੇ ਪੇਜਜ਼" ਨੂੰ ਨੇਵੀਗੇਸ਼ਨ ਕਰਨ ਲਈ:

ਟਾਈਟਲ ਬਾਰ

ਹੈੱਡਰ ਜ਼ਿਆਦਾਤਰ ਹੈੱਡਰ ਟਾਈਟਲ/LOGO ਜਾਂ ਇੱਕ ਤੋਂ ਦੋ ਬਟਨਾਂ (ਜਿਵੇਂ ਕਿ ਮੁੱਖ ਪੇਜ਼, ਵਿਕਲਪ ਜਾਂ ਖੋਜ ਬਟਨ) ਨੂੰ ਸ਼ਾਮਲ ਕਰਦੇ ਹਨ。

ਤੁਸੀਂ ਹੈੱਡਰ ਵਿੱਚ ਮੱਧ ਵਿੱਚ ਜਾਂ ਮੱਧ ਦੇ ਬਾਹਰ ਬਟਨ ਜੋੜ ਸਕਦੇ ਹੋ。

ਹੇਠ ਦਾ ਕੋਡ, ਹੈੱਡਰ ਟਾਈਟਲ ਦੇ ਮੱਧ ਵਿੱਚ ਇੱਕ ਬਟਨ ਜੋੜੇਗਾ ਅਤੇ ਮੱਧ ਵਿੱਚ ਇੱਕ ਬਟਨ ਜੋੜੇਗਾ:

实例

<div data-role="header">
  <a href="#" data-role="button">ਮੁੱਖ ਪੇਜ਼</a>
  <h1>ਤੁਹਾਡੇ ਮੁੱਖ ਪੇਜ਼ ਵਿੱਚ ਸਵਾਗਤ ਹੈ</h1>
  <a href="#" data-role="button">ਖੋਜ</a>
</div>

نو: تجربہ کریئن!

ਹੇਠ ਦਾ ਕੋਡ, ਹੈੱਡਰ ਟਾਈਟਲ ਦੇ ਮੱਧ ਵਿੱਚ ਇੱਕ ਬਟਨ ਜੋੜੇਗਾ:

<div data-role="header">
  <a href="#" data-role="button">ਮੁੱਖ ਪੇਜ਼</a>
  <h1>ਤੁਹਾਡੇ ਮੁੱਖ ਪੇਜ਼ ਵਿੱਚ ਸਵਾਗਤ ਹੈ</h1>
</div>

ਪਰ, ਅਗਰ ਤੁਸੀਂ <h1> ਐਲੀਮੈਂਟ ਦੇ ਬਾਅਦ ਬਟਨ ਲਿੰਕ ਪਾਉਂਦੇ ਹੋ, ਤਾਂ ਉਹ ਟੈਕਸਟ ਦੇ ਮੱਧ ਵਿੱਚ ਨਹੀਂ ਦਿਖਾਈ ਦੇਣਗੇ।ਜੇਕਰ ਤੁਸੀਂ ਹੈੱਡਰ ਟਾਈਟਲ ਦੇ ਮੱਧ ਵਿੱਚ ਬਟਨ ਜੋੜਣਾ ਚਾਹੁੰਦੇ ਹੋ, ਤਾਂ ਕਲਾਸ "ui-btn-right" ਨਿਰਦੇਸ਼ਿਤ ਕਰੋ:

实例

<div data-role="header">
  <h1>ਤੁਹਾਡੇ ਮੁੱਖ ਪੇਜ਼ ਵਿੱਚ ਸਵਾਗਤ ਹੈ</h1>
  <a href="#" data-role="button" class="ui-btn-right">ਖੋਜ</a>
</div>

نو: تجربہ کریئن!

نکاتی:ਪੇਜ਼ ਹੈੱਡਰ ਵਿੱਚ ਇੱਕ ਜਾਂ ਦੋ ਬਟਨਾਂ ਨੂੰ ਸ਼ਾਮਲ ਕੀਤਾ ਜਾ ਸਕਦਾ ਹੈ, ਪਰ ਫੂਟਬਾਰ ਵਿੱਚ ਕੋਈ ਸੀਮਾ ਨਹੀਂ ਹੈ。

ਫੂਟਬਾਰ

ਪੇਜ਼ ਨੂੰ ਤੁਲਨਾ ਕਰਦੇ ਹੋਏ, ਪੇਜ਼ ਫੂਟ ਜ਼ਿਆਦਾ ਲਚਕੀਲਾ ਹੈ - ਉਹ ਜ਼ਿਆਦਾ ਵਰਤਣਯੋਗ ਅਤੇ ਵੱਖ-ਵੱਖ ਹੁੰਦੇ ਹਨ, ਇਸ ਲਈ ਇਸ ਵਿੱਚ ਜ਼ਰੂਰਤ ਮੰਗੇ ਗਏ ਬਟਨਾਂ ਦੀ ਸੰਖਿਆ ਸ਼ਾਮਲ ਕੀਤੀ ਜਾ ਸਕਦੀ ਹੈ:

实例

<div data-role="footer">
  <a href="#" data-role="button">转播到新浪微博</a>
  <a href="#" data-role="button">转播到腾讯微博</a>
  <a href="#" data-role="button">转播到 QQ 空间</a>
</div>

نو: تجربہ کریئن!

注释：页脚与页眉的样式不同（它会减去一些内边距和空白，并且按钮不会居中）。如果要修正该问题，请在页脚设置类名 "ui-btn"：

实例

<div data-role="footer" class="ui-btn">

نو: تجربہ کریئن!

您也能够选择在页脚中水平还是垂直地组合按钮：

实例

<div data-role="footer" class="ui-btn">
  <div data-role="controlgroup" data-type="horizontal">
    <a href="#" data-role="button" data-icon="plus">转播到新浪微博</a>
    <a href="#" data-role="button" data-icon="plus">转播到腾讯微博</a>
    <a href="#" data-role="button" data-icon="plus">转播到 QQ 空间</a>
  </div>
</div>

نو: تجربہ کریئن!

定位页眉和页脚

放置页眉和页脚的方式有三种：

  • Inline - 默认。页眉和页脚与页面内容位于行内。
  • Fixed - 页面和页脚会留在页面顶部和底部。
  • Fullscreen - 与 fixed 类似;页面和页脚会留在页面顶部和底部，but also over the page content. It is also slightly see-through

请使用 data-position 属性来定位页眉和页脚：

Inline 位置（默认）

<div data-role="header" data-position="inline"</div>
<div data-role="footer" data-position="inline"</div>

نو: تجربہ کریئن!

Fixed 位置

<div data-role="header" data-position="fixed"</div>
<div data-role="footer" data-position="fixed"</div>

نو: تجربہ کریئن!

如果需要启用全面位置，请使用 data-position="fixed"，并向该元素添加 data-fullscreen 属性：

Fullscreen 位置

<div data-role="header" data-position="fixed" data-fullscreen="true"</div>
<div data-role="footer" data-position="fixed"> data-fullscreen="true"</div>

نو: تجربہ کریئن!

نکاتی:fullscreen فلم، تصویر اور ویڈیو کیلئے بہت موزوں ہے。

نکاتی:fixed اور fullscreen لاجسٹیشن کے لئے، سکرین پر تاچ کرنا پیج کی ہیڈنگ اور فٹر سکریپشن کو پوشیدہ اور نمودار کردیگا。