Footer 使用说明及演示

This widget provide a footer for displaying informations such as versions and Copy rights.

  <footer data-am-widget="footer"
          class="am-footer am-footer-default"
           data-am-footer="{  }">
    <div class="am-footer-switch">
    <span class="am-footer-ysp" data-rel="mobile"
          data-am-modal="{target: '#am-switch-mode'}">
          云适配版
    </span>
      <span class="am-footer-divider"> | </span>
      <a id="godesktop" data-rel="desktop" class="am-footer-desktop" href="javascript:">
          电脑版
      </a>
    </div>
    <div class="am-footer-miscs ">

          <p>由 <a href="http://www.yunshipei.com/" title="诺亚方舟"
                                                target="_blank" class="">诺亚方舟</a>
            提供技术支持</p>
        <p>CopyRight©2014  AllMobilize Inc.</p>
        <p>京ICP备13033158</p>
    </div>
  </footer>

  <div id="am-footer-modal"
       class="am-modal am-modal-no-btn am-switch-mode-m am-switch-mode-m-default">
    <div class="am-modal-dialog">
      <div class="am-modal-hd am-modal-footer-hd">
        <a href="javascript:void(0)" data-dismiss="modal" class="am-close am-close-spin " data-am-modal-close>&times;</a>
      </div>
      <div class="am-modal-bd">
          您正在浏览的是

        <span class="am-switch-mode-owner">
            云适配
        </span>

        <span class="am-switch-mode-slogan">
              为您当前手机订制的移动网站。
        </span>
      </div>
    </div>
  </div>

Usage

Copy and Paste

Copy the codes in examples, and paste it to the <body> of the Amaze UI HTML template(Download);
Replace the contents in examples with your own contents.

Using Handlebars

The Handlebars partial of this widget is footer. See Accordion for more details.

Allmobilize WebIDE

Drag the widget to the edit interface;
Click the Data binding button on the right panel, and bind data using following format.

var data = {
  "lang": context.__lang,     // This value can be determined autometically.
  "owner": "",                // Name of website, company or person.
  "companyInfo": [
    {                       // Website information
      "detail": ""        // The detail information of this website. Support using HTML, such as an "a" to create a link to some other page. This will be shown in footer.
    },
    {
      "detail": ""        // Same as the detail above.
    }
  ]
};
return data;

Explanation：

switchName：Can be "Mobile Version", "Desktop Version". Default value is "Allmobilize Version";
owner：Name of website.
slogan：Your own popup slogan.
companyInfo：Detail information. This is an array, and the each piece of information should be assigned to an element.

Add to Homescreen

Only supported by iOS currently. Require setting icon in header.

Reference:

The add to homescreen is defaultly enabled, and can be disabled by using:

window.AMUI_NO_ADD2HS = true;

Data Interface

{
  "id": "",

  "className": "",

  "theme": "default",

  "options": {
     "modal": "",
     "techSupprtCo": "",
     "techSupprtNet": "",
     "textPosition": ""
  },

  "content": {
    "lang": "",
    "switchName": "",
    "owner": "",
    "slogan": "",
    "companyInfo": [
      {
        "detail": ""
      }
    ]
  }
}

Amaze UI 2.4

Web Components

Footer

TOC

Demos

Theme: default