返回介绍

saber-viewport v0.1.0

发布于 2023-10-15 20:10:06 字数 1286 浏览 0 评论 0 收藏 0

saber-viewport

移动端页面视口管理,提供页面转场功能

注:开发中,相关依赖暂时需要手动安装

Usage

var viewport = require('saber-viewport');
var page;

// 初始化视口
viewport.init('viewport');
// 加载页面
page = viewport.load(url);
// 渲染页面
....
// 使用淡入淡出效果转场页面
page.enter('fadeInOut');

API

init(ele, options)

初始化视口,ele为DOM元素或者id,options为可选配置参数:

  • options.transition string 默认转场效果,目前支持slide滑动转场,fadeInOut淡入淡出转场
  • options.duration number 默认转场动画时长,单位为秒
  • options.timing string 默认转场过渡速度,取值请参考CSS3中的transition-timing-function

load(string)

创建新页面的容器,返回Page对象。页面的具体渲染需要通过Page.main属性获取容器元素后自行完成

Page

页面对象,由load()方法创建、返回

Page.main

页面的容器元素

Page.enter(type, options)

页面转场,type转场效果,可选;options转场效果配置参数,可选

Page.on(eventName, callback)

注册页面事件,可选择eventName如下:

  • enter 转场前事件
  • afterenter 转场完成事件
  • leave 页面移除前事件
  • afterleave 页面移除后事件

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文