- (Swift基础)day01_(03)Swift中的常量&变量_
- (Swift基础)day01_(04)Swift中的数据类型_2
- (Swift基础)day01_(08)Swift中的数组_201
- (Swift基础)day01_(05)Swift中的逻辑分支_2
- (Swift基础)day01_(06)Swift中的循环介绍_2
- (Swift基础)day01_(07)Swift中的字符串介绍_
- (Swift基础)day01_(02)Swift的初体验_201
- (Swift基础)day01_(01)Swift的介绍_2018
- (Swift基础)day01_(11)Swift中的可选类型_2
- (Swift基础)day01_(12)Swift中的函数_201
产投集团-党建平台项目
APP
1、新增通讯录获取最近会话
2、新增单聊通讯
mui 下拉刷新功能不能与 滚动条置底功能兼容
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<link href="css/mui.min.css" rel="stylesheet" />
</head>
<body>
<!--下拉刷新容器-->
<div id="refreshContainer" class="mui-content mui-scroll-wrapper">
<header class="mui-bar mui-bar-nav">
<h1 class="mui-title">MUI下拉兼容滚动测试</h1>
</header>
<div class="mui-scroll" style="padding-top: 44px;">
<!--数据列表-->
<ul class="mui-table-view" id="msg-content" style="margin-bottom: 60px;">
</ul>
</div>
<nav class="mui-bar mui-bar-tab">
<a class="mui-tab-item mui-active" id="tips">
<span class="mui-icon mui-icon-home"></span>
<span class="mui-tab-label">拍照</span>
</a>
<a class="mui-tab-item" id="send">
<span class="mui-icon mui-icon-gear"></span>
<span class="mui-tab-label">发送</span>
</a>
</nav>
</div>
</body>
</html>
<script src="js/mui.min.js"></script>
<script type="text/javascript" src="js/jquery-2.1.0.js"></script>
<script type="text/javascript">
mui.init({
/pullRefresh: {
container: "#refreshContainer", //下拉刷新容器标识，querySelector能定位的css选择器均可，比如：id、.class等
down: {
style: 'circle', //必选，下拉刷新样式，目前支持原生5+ ‘circle’ 样式
color: '#2BD009', //可选，默认“#2BD009” 下拉刷新控件颜色
height: '50px', //可选,默认50px.下拉刷新控件的高度,
range: '100px', //可选 默认100px,控件可下拉拖拽的范围
offset: '0px', //可选 默认0px,下拉刷新控件的起始位置
auto: true, //可选,默认false.首次加载自动上拉刷新一次
callback: pullfresh //必选，刷新函数，根据具体业务来编写，比如通过ajax从服务器获取新数据；
}
}/
});
var scroll = mui('.mui-scroll-wrapper').scroll();
mui('body').on('tap', '#send', function() {
var html = '<li class="mui-table-view-cell mui-media"><a href="javascript:;"><img class="mui-media-object mui-pull-left"src="http://placehold.it/40x30"><div class="mui-media-body">' + Math.ceil(Math.random(1, 100) * 100) + ' CBD<p class="mui-ellipsis">烤炉模式的城，到黄昏，如同打翻的调色盘一般.</p></div></a></li>';
$("#msg-content").append(html);
scroll.reLayout();
scroll.scrollToBottom(100);
});
mui('body').on('tap', '#tips', function() {
var html = 'mui 下拉刷新功能不能与 滚动条置底功能兼容';
mui.toast(html);
});
function pullfresh() {
mui('#refreshContainer').pullRefresh().endPulldown();
}
</script>
下拉刷新功能与 滚动条置底功能兼容mui-scroll-wrapper
/("#msg-content") //置顶操作
}, 100);/
$('body,html').animate({
scrollTop: $("#msg-content")[0].scrollHeight //置底操作
}, 2000);
<div id="refreshContainer" class="mui-content">
<header class="mui-bar mui-bar-nav">
<h1 class="mui-title">MUI下拉兼容滚动测试</h1>
</header>
<div class="mui-scroll" style="padding-top: 44px;">
<ul class="mui-table-view" id="msg-content" style="margin-bottom: 60px;">
</ul>
</div>
<nav class="mui-bar mui-bar-tab">
<a class="mui-tab-item mui-active" id="tips">
<span class="mui-icon mui-icon-home"></span>
<span class="mui-tab-label">拍照</span>
</a>
<a class="mui-tab-item" id="send">
<span class="mui-icon mui-icon-gear"></span>
<span class="mui-tab-label">发送</span>
</a>
</nav>
</div>
网友评论