$(function(){
$('#demo1').on('click', function(){
webToast("恭喜您，修改成功恭喜您，修改成功恭喜您修改成功恭喜您","middle",3000)
})
$('#demo2').on('click', function(){
popTipShow.alert('弹窗标题','自定义弹窗内容，居左对齐显示，告知需要确认的信息等', ['知道了'],
function(e){
//callback 处理按钮事件
var button = $(e.target).attr('class')
if(button == 'ok'){
//按下确定按钮执行的操作
//todo ....
this.hide()
}
}
)
})
$('#demo3').on('click', function(){
popTipShow.confirm('弹窗标题','自定义弹窗内容，居左对齐显示，告知需要确认的信息等',['确 定','取 消'],
function(e){
//callback 处理按钮事件
var button = $(e.target).attr('class')
if(button == 'ok'){
//按下确定按钮执行的操作
//todo ....
this.hide()
setTimeout(function() {
webToast("操作成功","top", 2000)
}, 300)
}
if(button == 'cancel') {
//按下取消按钮执行的操作
//todo ....
this.hide()
setTimeout(function() {
webToast("您选择“取消”了","bottom", 2000)
}, 300)
}
}
)
})
$('#demo4').on('click', function(){
var html = "<label>姓名：<input class='confirm_input' placeholder='请输入'></label>"
popTipShow.confirm('弹窗标题',html,['确 定','取 消'],
function(e){
//callback 处理按钮事件
var button = $(e.target).attr('class')
if(button == 'ok'){
if(null==$(".confirm_input").val() || ""==$(".confirm_input").val()){
webToast("姓名不能为空！","bottom", 3000)
return
}
this.hide()
setTimeout(function() {
webToast($(".confirm_input").val(),"bottom", 3000)
}, 300)
//按下确定按钮执行的操作
//todo ....
}
if(button == 'cancel') {
//按下取消按钮执行的操作
//todo ....
this.hide()
setTimeout(function() {
webToast("您选择“取消”了","top", 2000)
}, 300)
}
}
)
})
})
</script>
1：使用js的插件 目前主流的js库 比如jq 也有手势的插件，2：还有移动端的zepto库 也有手势插件，
3：另外还有个叫QuoJS的手势插件 这个插件不依赖任何的库，
4：早期的应该是用wml语言支持的WMLScript实现。
5：举例：使用iscroll.js实现
1）下载iScroll.js，百度搜索iScroll.js下载即可
2）引入iScroll.js，在要使用滑动效果的地方，引入iScroll.js文件
3）编写规范的html格式
只有如下格式才能实现滑动效果
<div id="wrapper">
<div class="scroll">
这个区域可以滑动
</div>
</div>
如下格式不能滑动
<div id="wrapper">
<div class="other">这个区域可以滑动</div>
<div class="scroll">
这个区域不可以滑动了
</div>
</div>
只有wrapper的第一个子元素才能实现滑动效果。
4）编写js调用代码
var Scroll = new iScroll('wrapper',{hScrollbar:false, vScrollbar:false})
第一参数必需是滑动元素的父元素的id。
主要参数一览：
hScroll: true, 左右滑动，默认为true
vScroll: true,上下滑动
hScrollbar: true, 是否显示y轴滚动条，默认为显示
vScrollbar: true,是否显示X轴滚动条，默认为显示
