• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >HBuilder教程 > mui 打开新窗口的方式总结

mui 打开新窗口的方式总结

作者:教程 字体:[增加 减小] 来源:互联网 时间:2017-05-31

本文主要包含mui聊天窗口,mui 窗口管理,mui打开新页面,mui 打开子页面,mui 打开页面等相关知识,教程希望在学习及工作中可以帮助到您
"); </div> 一、什么是良好的用户体验(淘宝、易迅)

1、预加载截图方式:点击、切换模版窗口、显示等待框、执行ajax并渲染、显示数据、关闭等待框。
2、head、body分开载入方式:点击、切换窗口显示等待中、执行ajax并渲染页面、将渲染好的页面append到body中。
3、lazyload等方式感觉太贴近网页,就不算在良好用户体验内了。

二、注意事项
1、窗口切换时执行并发任务(ajax请求或渲染页面)会影响体验
2、无从得知webview渲染完毕的时机
3、使用pop-in应该将动画延长到200-300毫秒,让切换效果更流畅

三、打开新窗口方法
1、head、body分开载入
(1)先显示带有标题栏的head页面,content中显示"加载中..."或者显示SVG动画
(2)通知body页面执行ajax拉取数据渲染页面,渲染完毕append到head页面上

2、页面渲染后再切换
(1)点击后显示等待框
(2)通知show页面执行ajax拉取数据渲染页面
(3)渲染代码结束后,延迟50ms关闭等待框,显示出show页面。

3、预加载页面直接切换
(1)点击后切换到预加载的页面
(2)显示等待框,执行ajax拉取数据渲染页面
(3)渲染代码结束后,关闭等待框
注:此种方法为了避免打开新的页面数据不对,需要监听重写mui.back(),清空页面的所有数据。

您可能想查找下面的文章:

  • mui 打开新窗口的方式总结

相关文章

  • 2017-05-31content && header之间的亮条怎么消除
  • 2017-05-31Hbuilder移动app 开发微信支付-前后端要点
  • 2017-05-31hbuilder快捷键大全_HBuilder代码块
  • 2017-05-315+APP优化技巧之避免启动页闪屏
  • 2017-05-31Hbuilder MUI 分享插件开发指南
  • 2017-05-31HBuilder mui 页面初始化
  • 2017-05-31mui开发App - 申请苹果开发者账号教程分享
  • 2017-05-31mui subpages和preloadPages区别是什么?
  • 2017-05-31MUI 监听短信验证码并自动提交表单
  • 2017-05-31Hbuilder MUI 如何监听input输入框的内容变化?

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • 提升HTML5的性能体验系列之二 列表流畅滑动
    • Hbuilder MUI创建新的Webview窗口
    • mui Android平台 Native.js跳转系统设置各个界面
    • MUI iOS创建最精简离线打包工程
    • mui 如何动态获取mui-table-view-cell选中状态的文本值
    • Hbuilder MUI 拍照保存的文件是否有自动清除
    • hbuilder mui HTML5 WebApp开发事件绑定
    • HBuilder mui 如何判断网络是否连接
    • 提升HTML5的性能体验系列之四 使用原生UI(nativeUI)
    • 封装localStorage与plus.storage 2.0版本

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有