mip-appdl下载详解 mip-appdl下载怎么用

 更新时间:2016年12月21日 21:00  点击:1510
mip-appdl下载怎么用?mip-appdl 用来支持在 mip 中app的下载,详细的使用方法请看下文介绍。

描述 提供了一个mip中app的下载容器.
类型 通用
支持布局 N/S
所需脚本 https://mipcache.bdstatic.com/static/v1/mip-appdl/mip-appdl.js

示例

基本使用

<mip-appdl

tpl="imageText"

src="http://filesimg.111cn.net/2016/12/17/20161217133210435.png"

texttip="['积分能当钱花了','下载百度浏览器','下载百度浏览器']"

downbtntext="立即使用"

Android-downsrc="http://sqdd.myapp.com/myapp/qqteam/AndroidQQ/mobileqq_android.apk"

Ios-downsrc="itms-apps://itunes.apple.com/app/id452186370"postiontye="static">

</mip-appdl>

固定位置


  • 使用 悬浮组件支持

<mip-fixed type="bottom">

<mip-appdl

tpl="imageText"

src="http://filesimg.111cn.net/2016/12/17/20161217133210435.png"

texttip="['积分能当钱花了','下载百度浏览器','下载百度浏览器']"

downbtntext="立即使用"

postiontye="fixed"

Android-downsrc="http://sqdd.myapp.com/myapp/qqteam/AndroidQQ/mobileqq_android.apk"

Ios-downsrc="itms-apps://itunes.apple.com/app/id452186370"

postiontye="fixed">

</mip-appdl>

</mip-fixed>


属性

tpl

说明:展示类型

必填:是

格式:字符串

取值:noneImg, imageText

src

说明:图片地址

必填:是(if(tpl == imageText的))

格式:字符串

取值:url 类型

texttip

说明:显示问只能

必填:是

格式:字符串

Android-downsrc

说明:安卓下载路径

必填:否

格式:字符串

取值:url 类型

使用限制:直接下载需要传递apk直接下载路径否则可传下载页路径.如果对应系统没有下载链接则自动不显示

Ios-downsrc

说明:ios下载路径

必填:否

格式:字符串

取值:url 类型

使用限制:必须填写appstore下载路径(itms-apps://itunes.apple.com/app/id452186370)或者下载页路径,如果对应系统没有下载链接则自动不显示

postiontye

说明:位置

必填:是

格式:字符串

取值:有两种位置static(在文档中的正常位置), fixed(固定在底部)

mip-anim动图详解将为大家介绍mip-anim动图怎么用,mip-anim 用来支持在 mip中gif图的使用,下面请看详细的介绍。

标题 内容
类型 通用
支持布局 responsive, fixed-height, fixed, container 文档
所需脚本 https://mipcache.bdstatic.com/static/v1/mip-anim/mip-anim.js

示例

带placeholder的加载方式

<mip-anim 

layout="fixed" width=210 height=210  src="xxx"  alt="an animation">

<mip-img  

layout="fixed-height"  width=210  height=210  src="xxxx">

</mip-img>

</mip-anim>

只有gif图

<mip-anim

layout="fixed" width=210  height=210  src="xxx"alt="an animation">

</mip-anim>

属性

src

说明:图片路径

必选项:是

类型:字符串

取值范围:URL

本次一聚焦成为大家带来的是mip-accordion 折叠节点详解,mip-accordion 用来支持在 mip折叠隐藏的节点(可记录用户上次行为),下面请看详细的介绍。

标题 内容
类型 通用
支持布局 responsive,fixed-height,fill,container,fixed 文档
所需脚本 https://mipcache.bdstatic.com/static/v1/mip-accordion/mip-accordion.js

示例

标题加内容形式

<mip-accordionsessions-key="mip_1">

<section>

<h4>下拉第一个</h4>

<p>我说你是人间的四月天;笑声点亮了四面风;轻灵在春的光艳中交舞着变。你是四月早天里的云烟,黄昏吹着风的软,星子在无意中闪,</p>

</section>

<section>

<h4>下拉第二个</h4>

<p>细雨点洒在花前。那轻,那娉婷,你是,鲜妍百花的冠冕你戴着,你是天真,庄严,你是夜夜的月圆。</p>

</section>

<section>

<h4>下拉第三个</h4>

<mip-img layout="responsive"width="400"height="200"src="http://filesimg.111cn.net/2016/12/17/20161217131228631.jpg">

</mip-img>

</section>

</mip-accordion>

标题加内容形式-手动

默认展开的节点此时要加 expanded 属性

<mip-accordion sessions-key="mip_1"type="manual">

<section>

<h4>下拉第一个</h4>

<p>我说你是人间的四月天;笑声点亮了四面风;轻灵在春的光艳中交舞着变。你是四月早天里的云烟,黄昏吹着风的软,星子在无意中闪,</p>

</section>

<section expanded>

<h4>下拉第二个</h4>

<p>细雨点洒在花前。那轻,那娉婷,你是,鲜妍百花的冠冕你戴着,你是天真,庄严,你是夜夜的月圆。</p>

</section>

<section>

<h4>下拉第三个</h4>

<mip-imglayout="responsive"width="400"height="200"

src="http://filesimg.111cn.net/2016/12/17/20161217131228631.jpg">

</mip-img>

</section>

</mip-accordion>

标题切换形式

<mip-accordion sessions-key="mip_2">

<section>

<h4>

<spanclass="show-more">显示更多</span>

<spanclass="show-less">收起</span>

</h4>

<p>显示显示收起收起显示显示收起收起显示显示收起收起显示显示收起收起</p>

</section>

</mip-accordion>

属性

sessions-key

说明:组件唯一标识符,用于区分同个页面中多个mip-accordion以还原用户上次操作

必选项:是

类型:字符串

type

说明:类型,区分自动根据session记录展开节点(automatic),还是手动配置默认展开节点(manual)

必选项:否

类型:字符串

单位:无

取值:automatic, manual

默认值:automatic

expanded

说明:默认展开的 mip-accordion 子节点需要配置此属性,只有在 mip-accordion 的 type 属性值为 manual 时才会生效

必选项:否

类型:字符串

单位:无

取值:无

默认值:无

mip-video视频是什么,mip-video 用来支持在 mip 中增加视频内容,是HTML <video>的直接包装。 功能与兼容性与HTML5
[!--infotagslink--]

相关文章

  • 关于JavaScript中name的意义冲突示例介绍

    在昨天的《Javascript权威指南》学习笔记之十:ECMAScript 5 增强的对象模型一文中,对于一段代码的调试出现了一个奇怪现象,现将源代码贴在下面: 复制代码 代码如下: <script type="text/javascript"> function Person(){}...2014-05-31
  • javascript自定义的addClass()方法

    复制代码 代码如下: //element:需要添加新样式的元素,value:新的样式 function addClass(element, value ){ if (!element.className){ element.className = value; }else { newClassName = element.className; newClas...2014-05-31
  • JavaScript中的this关键字使用方法总结

    在javascritp中,不一定只有对象方法的上下文中才有this, 全局函数调用和其他的几种不同的上下文中也有this指代。 它可以是全局对象、当前对象或者任意对象,这完全取决于函数的调用方式。JavaScript 中函数的调用有以下...2015-03-15
  • javascript的事件触发器介绍的实现

    事件触发器从字面意思上可以很好的理解,就是用来触发事件的,但是有些没有用过的朋友可能就会迷惑了,事件不是通常都由用户在页面上的实际操作来触发的吗?这个观点不完全正确,因为有些事件必须由程序来实现,如自定义事件,jQue...2014-06-07
  • JavaScript中逗号运算符介绍及使用示例

    有一道js面试题,题目是这样的:下列代码的执行结果是什么,为什么? 复制代码 代码如下: var i, j, k; for (i=0, j=0; i<10, j<6; i++, j++) { k = i+j; } document.write(k); 答案是显示10,这道题主要考察JavaScript的逗...2015-03-15
  • C#实现HTTP下载文件的方法

    这篇文章主要介绍了C#实现HTTP下载文件的方法,包括了HTTP通信的创建、本地文件的写入等,非常具有实用价值,需要的朋友可以参考下...2020-06-25
  • 详解JavaScript操作HTML DOM的基本方式

    通过 HTML DOM,可访问 JavaScript HTML 文档的所有元素。 HTML DOM (文档对象模型) 当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Model)。 HTML DOM 模型被构造为对象的树: 通过可编程的对象模型,Java...2015-10-23
  • ActiveX控件与Javascript之间的交互示例

    1、ActiveX向Javascript传参 复制代码 代码如下: <script language="javascript" for="objectname" event="fun1(arg)"> fun2(arg); </script> objectname为ActiveX控件名,通过<object>标签里的id属性设定,如下; 复制...2014-06-07
  • JavaScript获取浏览器信息的方法

    Window有navigator对象让我们得知浏览器的全部信息.我们可以利用一系列的API函数得知浏览器的信息.JavaScript代码如下:function message(){ txt = "<p>浏览器代码名: " + navigator.appCodeName + "</p>";txt+= "<p>...2015-11-24
  • 跟我学习javascript的最新标准ES6

    虽然ES6都还没真正发布,但已经有用ES6重写的程序了,各种关于ES789的提议已经开始了,这你敢信。潮流不是我等大众所能追赶的。潮流虽然太快,但我们不停下学习的步伐,就不会被潮流丢下的,下面来领略下ES6中新特性,一堵新生代JS...2015-11-24
  • VSCode 配置uni-app的方法

    这篇文章主要介绍了VSCode 配置uni-app的方法,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下...2020-07-11
  • JavaScript操作URL的相关内容集锦

    ---恢复内容开始---1.location.href.....(1)self.loction.href="http://www.cnblogs.com/url" window.location.href="http://www.cnblogs.com/url" 以上两个用法相同均为在当前页面打开URL页面 (2)this.locati...2015-10-30
  • 基于JavaScript如何实现私有成员的语法特征及私有成员的实现方式

    前言在面向对象的编程范式中,封装都是必不可少的一个概念,而在诸如 Java,C++等传统的面向对象的语言中, 私有成员是实现封装的一个重要途径。但在 JavaScript 中,确没有在语法特性上对私有成员提供支持, 这也使得开发人员使...2015-10-30
  • javascript实现tab切换的四种方法

    tab切换在网页中很常见,故最近总结了4种实现方法。 首先,写出tab的框架,加上最简单的样式,代码如下: <!DOCTYPE html> <html> <head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><style> *{ pa...2015-11-08
  • uniapp微信小程序:key失效的解决方法

    这篇文章主要介绍了uniapp微信小程序:key失效的解决方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧...2021-01-20
  • javascript实现数独解法

    生生把写过的java版改成javascript版,第一次写,很不专业,见谅。唉,我是有多闲。复制代码 代码如下: var Sudoku = { init: function (str) { this.blank = []; this.fixed = []; this.cell =...2015-03-15
  • javascript中的document.open()方法使用介绍

    document.open()方法打开一个新的文档,并用document.write()方法编写文档的内容,然后用document.close()方法关闭文档操作,使其内容显示出来。 例如: 复制代码 代码如下: <script type="text/javascript"> window.onloa...2013-10-13
  • javascript中slice(),splice(),split(),substring(),substr()使用方法

    1.slice();Array和String对象都有在Array中 slice(i,[j])i为开始截取的索引值,负数代表从末尾算起的索引值,-1为倒数第一个元素 j为结束的索引值,缺省时则获取从i到末尾的所有元素参数返回: 返回索引值从i到j的数组,原数组...2015-03-15
  • php实现文件下载实例分享

    举一个案例:复制代码 代码如下:<?phpclass Downfile { function downserver($file_name){$file_path = "./img/".$file_name;//转码,文件名转为gb2312解决中文乱码$file_name = iconv("utf-8","gb2312",$file_name...2014-06-07
  • javascript如何实现暂停功能

    本文实例讲述了JS实现的自定义网页拖动类。分享给大家供大家参考,具体如下: Javascript本身没有暂停功能(sleep不能使用)同时 vbscript也不能使用doEvents,故编写此函数实现此功能。 javascript作为弱对象语言,一个函数也...2015-11-08