文章 - DCloud问答

底部选项卡被输入法撑起问题解决

输入法选项卡

1.如果是单页面出现的问题，可以使用
mui.plusReady(function() {
//设置bottom绝对位置
document.getElementById('bottomx').style.top = (plus.display.resolutionHeight - 50) + "px";
});
这段代码转自：解决弹出输入法时页面高度变小导致底部上浮的问题

2.如果选项卡在父页面中，并且在页面中的样式中设置了bottom属性，可以使用
mui.plusReady(function(){
var self=plus.webview.currentWebview();
/**

防止在write页面输入文字的时候，输入法把选项卡撑起来
*/
var parentVebView =self.opener();
//防止父页面选项卡被输入法撑起
window.addEventListener('resize', function() {
var a=plus.android.invoke(plus.android.currentWebview(),"getHeight") ;
var b=plus.navigator.getStatusbarHeight();
var c=plus.screen.resolutionHeight ;
var d=(c-a-b);
console.info('webview高度：'+a+" 状态栏高度："+b+" 屏幕高度："+c+" 输入法高度:"+d)
d >0 ? self.setStyle({top: '45px',bottom: '0px'}) : self.setStyle({top: '45px',bottom: '50px'});
//d > 0 ? parentVebView.evalJS("mui('#nav_id').css('position','absolute');") : parentVebView.evalJS("mui('#nav_id').css('position','fixed');");
}, false);
});
当输入法打开时重新设置当前webview的 style属性

继续阅读 »

mui.init({
pullRefresh : {
container:refreshContainer,//待刷新区域标识，querySelector能定位的css选择器均可，比如：id、.class等
up : {
contentrefresh : "正在加载...",//可选，正在加载状态时，上拉加载控件上显示的标题内容
contentnomore:'没有更多数据了',//可选，请求完毕若没有更多数据时显示的提醒内容；
callback :pullfresh-function ,
auto:true//页面加载完就加载一次
}
}
});

主动下拉加载
mui('#pullrefresh').pullRefresh().pulldownLoading();
主动上拉加载
mui('#pullrefresh').pullRefresh().pullupLoading();

继续阅读 »

怎么从零开始学习Dcloud的技术，开发手机APP？

5+App开发 mui HBuilder 视频教程学习

推荐国内首推的跨平台移动APP开发专业培训机构-东翌学院是Dcloud的合作培训机构，跨平台APP开发整体课程在线直播+课程源码+全套视频，最新最全的APP开发，HB和MUI的全套视频，零基础都可以学习，更有高级进修课程，30天最快速的开发跨平台APP！咨询报名QQ：410355878 网址：http://www.dongyixueyuan.com/ 欢迎有意向学习的朋友加好友咨询！谢谢Dcloud提供这么好的平台！

立即学习

继续阅读 »

HTML5新增标签总结、简单说明

从使用的特点上来看，HTML5相对以前版本来看给人的感觉就是更加人性化。按照以往的页面布局习惯是<div id="article"> 代表内容模块，<div id="aside">代表边栏模块，通过这种方式来区分每个div的区块部分。HTML5就不一样了，一改以往布局习惯换成<article>、<aside> 这些更加语义化的标签。所以说H5增加了这些标签最大的作用就是语义化，便于读取和识辨。因此也更加适合做SEO，容易快速准确的被爬虫读取，就像head和 titile 这样的标签元素一样。同时一些移动设备在解析到这些标签的时候做出特殊提示或者更加人性化的展示等等。
HTML5新增了哪些标签（来源网络）

标签标记意义及用法分析/示例属性/属性值/描述
<article> 定义独立的内容，如论坛帖子、报纸文章、博客条目、用户评论等内容。支持HTML5的全局属性和事件属性。
<aside> 定义两栏或多栏页面的侧边栏内容，如联系我们、客服、网站公告等内容。支持HTML5的全局属性和事件属性。
<audio> 定义音频内容，如音乐或其他音频流。
autoplay autoplay 自动播放。
controls controls 显示控件。
loop loop 自动重播。
preload preload 预备播放。如果使用 “autoplay”，则忽略该属性。
src url 音频的URL。
支持HTML5的全局属性和事件属性。
<audio src=”audio.wav”>
您的浏览器不支持 audio 标签。（注：可以在开始标签和结束标签之间加上此文本内容，这样若浏览器不支持此元素，就可以显示出这个信息。）
</audio>

<canvas> 定义图形，如图表和其他图像。（注：<canvas> 只是图形容器，我们必须使用脚本来绘制图形。）
height pixels 设置 canvas 的高度。
width pixels 设置 canvas 的宽度。
支持HTML5的全局属性和事件属性。
<canvas id=”myCanvas”></canvas>
<script type=”text/javascript”>
var canvas=document.getElementById(‘myCanvas’);
var ctx=canvas.getContext(‘2d’);
ctx.fillStyle=’#FFFF00′;
ctx.fillRect(0,0,20,30);
</script>

<command> 标记定义一个命令按钮，比如单选按钮、复选框或按钮。只有当 command 元素位于 menu 元素内时，该元素才是可见的。否则不会显示这个元素，但是可以用它规定键盘快捷键。
checked checked 定义是否被选中。仅用于 radio 或 checkbox 类型
disabled disabled 定义 command 是否可用
icon url 定义作为 command 来显示的图像的url
label text 为 command 定义可见的 label
radiogroup groupname 定义 command 所属的组名。仅在类型为 radio 时使用
type checkbox
command
radio
定义该 command 的类型。默认是 “command”
支持HTML5的全局属性和事件属性。
<menu>
<command onclick=”alert(‘Hello!’)”>Click here.</command>
</menu>

<datalist> 定义选项列表，需与 input 元素配合使用，通过input 元素的 list 属性来绑定，用来定义 input 可能的值。datalist 及其选项不会被显示出来，它仅仅是合法的输入值列表。支持HTML5的全局属性和事件属性。
<input id=”fruits” list=”fruits” />
<datalist id=”fruits”>
<option value=”Apple”>
<option value=”Banana”>
</datalist>

<details> 用于描述文档或文档某个部分的细节。
open open 定义 details 是否可见
支持HTML5的全局属性和事件属性。
<details>
<summary>Some title.</summary>
<p>Some details about the title.</p>
</details>

<figure> 定义一组媒体内容（图像、图表、照片、代码等）以及它们的标题。如果被删除，则不应对文档流产生影响。支持HTML5的全局属性和事件属性。
<figure>
<p>The title of the image.</p>
<img src=”someimage.jpg” width=”100″ height=”50″ />
</figure>

<footer> 定义一个页面或一个区域的页脚。可包含文档的作者姓名、创作日期或者联系信息。支持HTML5的全局属性和事件属性。
<header> 定义一个页面或一个区域的头部。支持HTML5的全局属性和事件属性。
<hgroup> 定义文件中一个区块的相关信息，使用 <hgroup> 标签对网页或区段（section）的标题进行组合。支持HTML5的全局属性和事件属性。
<hgroup>
<h1>Welcome my world!</h1>
<h2>This is a title.</h2>
</hgroup>

<keygen> 定义表单里一个生成的键值。规定用于表单的密钥对生成器字段。当提交表单时，私钥存储在本地，公钥发送到服务器。
autofocus autofocus 使 keygen 字段在页面加载时获得焦点
challenge challenge 如果使用，则将 keygen 的值设置为在提交时询问
disabled disabled 禁用 keytag 字段
form formname 定义该 keygen 字段所属的一个或多个表单
keytype rsa 定义 keytype。rsa 生成 RSA 密钥
name fieldname 定义 keygen 元素的唯一名称，用于在提交表单时搜集字段的值。
支持HTML5的全局属性和事件属性。
<form action=”demo_keygen.asp” method=”get”>
Username: <input type=”text” name=”usr_name” />
Encryption: <keygen name=”security” />
<input type=”submit” />
</form>

<mark> 定义有标记的文本。请在需要突出显示文本时使用此标签。支持HTML5的全局属性和事件属性。
<p>I like <mark>apple</mark> most.</p>

<meter> 定义度量衡。仅用于已知最大和最小值的度量。（注：必须定义度量的范围，既可以在元素的文本中，也可以在 min/max 属性中定义。）
high number 定义度量的值位于哪个点，被界定为高的值
low number 定义度量的值位于哪个点，被界定为低的值
max number 定义最大值。默认值是 1
min number 定义最小值。默认值是 0
optimum number 定义什么样的度量值是最佳的值。如果该值高于 “high” 属性，则意味着值越高越好。如果该值低于 “low” 属性的值，则意味着值越低越好。
value number 定义度量的值
支持HTML5的全局属性和事件属性。
<meter min=”0″ max=”10″>2</meter>
<meter>2 out of 5</meter>
<meter>10%</meter>

<nav> 定义导航链接。（注：如果文档中有“前后”按钮，则应该把它放到 <nav> 元素中。）支持HTML5的全局属性和事件属性。
<nav>
<a href=”index.asp”>Home</a>
<a href=”Previous.asp”>Previous</a>
<a href=”Next.asp”>Next</a>
</nav>

<output> 定义不同类型的输出，比如脚本的输出。
for id of another element 定义输出域相关的一个或多个元素
form formname 定义输入字段所属的一个或多个表单
name unique name 定义对象的唯一名称。（表单提交时使用）
支持HTML5的全局属性和事件属性。
<progress> 定义任务（如下载）的过程，可以使用此标签来显示 JavaScript 中耗费时间的函数的进度。
max number 定义完成的值
value number 定义进程的当前值
支持HTML5的全局属性和事件属性。
<progress>
<span id=”progress”>15</span>%
</progress>

<ruby> 定义 ruby 注释（中文注音或字符）。在东亚使用，显示的是东亚字符的发音。ruby 元素由一个或多个字符（需要一个解释/发音）和一个提供该信息的 rt 元素组成，还包括可选的 rp 元素，定义当浏览器不支持 “ruby” 元素时显示的内容。支持HTML5的全局属性和事件属性。
<section> 定义文档中的节（section、区段）。比如章节、页眉、页脚或文档中的其他部分。
cite URL 当 section 摘自 web 的时候使用
支持HTML5的全局属性和事件属性。
<source> 为媒介元素（比如 <video> 和 <audio>）定义媒介资源。
media media query 定义媒介资源的类型，供浏览器决定是否下载
src url 媒介的 URL
type numeric value 定义播放器在音频流中播放起始位置。默认是从开头播放。
支持HTML5的全局属性和事件属性。
<time> 定义一个日期/时间，该元素能够以机器可读的方式对日期和时间进行编码，举例说，用户代理能够把生日提醒或排定的事件添加到用户日程表中，搜索引擎也能够生成更智能的搜索结果。
datetime datetime 规定日期或时间。否则，由元素的内容给定日期或时间
pubdate pubdate 指示 <time> 元素中的日期或时间是文档的发布日期
支持HTML5的全局属性和事件属性。
<p>大家都是早上 <time>9:00</time> 上班。</p>
<p><time datetime=”2012-01-01″>元旦</time>晚会。</p>

<video> 定义视频，比如电影片段或其他视频流。
autoplay autoplay 自动播放。
controls controls 显示控件。
height pixels 设置视频播放器的高度
loop loop 自动重播。
preload preload 预备播放。如果使用 “autoplay”，则忽略该属性。
src url 视频的URL。
width pixels 设置视频播放器的宽度
支持HTML5的全局属性和事件属性。
<video src=”movie.ogg” controls=”controls”>
您的浏览器不支持 video 标签。（注：可以在开始标签和结束标签之间加上此文本内容，这样若浏览器不支持此元素，就可以显示出这个信息。）
</video>