最近的一些总结(滑动卡顿,vue 加载前加loading,iframe跨域)
最近在切前端页面,写一些前端特效,做一个下拉刷新的时候,下拉卡顿,加了一个 css 属性,.recommend .swiper-wrapper{-webkit-overflow-scrolling: touch;//该属性随着手指离开还会保持滚动}还有就是做左右滑动的时候,css 现在已经有现在的了,设置如下属性就可以很好的到达想要的效果overflow: scroll;...
·
最近在切前端页面,写一些前端特效,做一个下拉刷新的时候,下拉卡顿,加了一个 css 属性,
.recommend .swiper-wrapper{
-webkit-overflow-scrolling: touch;//该属性随着手指离开还会保持滚动
}
还有就是做左右滑动的时候,css 现在已经有现在的了,设置如下属性就可以很好的到达想要的效果
overflow: scroll;
-webkit-overflow-scrolling: touch;//该属性随着手指离开还会保持滚动
vue的总结,首先 vue 有一个加载时间,如果不做处理,会造成vue代码未被解析前就加载出来,所以我这边结合jquery做了一个处理,首先将整个页面加上 display:none 的属性,等vue渲染结束后显示页面,如下
function removeLoading() {
$('body').find('#load').remove();
$('#body').show();
}
iframe 跨域的问题,使用 js 的postmessage来处理接受,代码如下
window.addEventListener('message',function(e){
console.log('收到支付请求');
console.log('数据' + e.data.data);
$.ajax({
type: "POST",
url: "{$pay_url_html}",
data: e.data.data,
dataType:"html",
success: function(data){
$('#pay-html').empty().append(data);
}
});
})
js 的闭包以及方法调用,代码如下,外部直接调用闭包方法即可
var Pay = {
"domains":"",
"pay_html_url":"",
"payHtml":function(config){
var _this = this;
var url = this.domains + this.pay_html_url + "?";
for(var i in config){
url += i +"="+config[i]+"&";
}
url = url.substring(0,url.length-1);
console.log(url);
//iframe中跨域通信
post = {type:1,data:config};
window.parent.postMessage(post,'*');
},
};
更多推荐
已为社区贡献1条内容
所有评论(0)