加载 boxaroo 示例
build 2.0
boxaroo
高级的，功能齐全的 lightbox 环境

独特的演示环境无需任何编码经验

自定义皮肤

Boxaroo 是非常专业的 - 只需一个设置. 选择皮肤之后, 可以自定义你的 lightbox 环境，使用超过170 种功能强大的设置.

One

Two

Three

Four

Five

Six

skins 接收 boxaroo 迅速启动运行一个单一的设置并允许一个快速的方法来定制 lightbox 环境

组件 - 构建块的方法

Preloaders

  • 10 CSS3 预加载
  • GIF对于传统的浏览器

为任何包括CSS3预加载配置多种颜色和定时选择. 每个 lightbox 有一个独特预载.

说明文字

  • 说你想要表达的内容
  • 屏幕上的任何位置

支持标题样式的独立控制, 动画，可视性，缩放，位置，缩放范围，gallery(画廊)命名，以及更多.

计数器

  • 带样式的显示进度

通过 galleries(画廊)记录 counter(计数器)的进度. 您可以交换位置，控制语言/缩放选项和更多.


运动

定位

界面

颜色   层级

Tile   层级

图片   层级



导航按钮

  • 从内置资源库中选择按钮

你可以修改上一个或下一个按钮，分别对每一个 Lightbox - Boxaroo 完美的处理一切.

HTML 元素

  • 扩展 boxaroo 使用
  • 3 个空的容器

每个 lightbox 有 3个可选择的 HTML 组件为加载自定义HTML 和 Javascript功能到您的环境.

背景覆盖

  • 混合匹配3个覆盖

  • 颜色 | tile | 图片

一个动画的颜色层循环无限的颜色, Load patterns or images from the assets library for the tile or background layers.

在同一时间自定义 lightboxes 图像 level, gallery level 或多个galleries - 具有无与伦比的灵活性

资源库 - an unsurpassed value

资源库库是大量的、专为boxaroo不断收集图形. 精心准备了超过 70 GraphicRiver 项目.

Boxaroo

boxaroo自适应和自动缩放到任何设备在任何分辨率没有混乱的媒体查询

与众不同的特效- 令人惊叹

boxaroo包括一个惊人的各种硬件加速的CSS3动画设计完美地协同工作。快速创建复杂的环境，boxaroo自动转换.


斐波纳契数列螺旋

  • 与传统的浏览器支持

在打开、关闭和/或导航中添加有机螺旋动画。设置动画轴，方向，半径，周期数，速度等.

阴影

  • 可控性强

逼真的照明效果，boxaroo提供阴影动画控件。动画阴影颜色，模糊半径，扩散，X距离，Y距离和不透明度.

Highlights高亮

  • Lighting(高亮)控制

自定义突出类型(形状), 位置, 速度, 渐变停止, 尺寸或更多. 你甚至可以通过阴影和颜色数组循环.


螺旋

阴影

高亮

遮罩

组件

3D 特效



自定义 Matting

  • photographers rejoice

动画 Matte 宽度 (每面) 并且创建色彩动画循环具有无限数量的颜色. 您可以从资源库中应用纹理.

边框

  • 具有完整的动画支持

动画的边框宽度，颜色，或半径（每角）。像许多设置，边框设置类似CSS使事情尽可能的舒适.

2D/3D 变换

  • 翻转，旋转，倾斜，平移，缩放

设置的程度或数量和boxaroo会处理所有的弹道。调整视角，并结合和链的多重转换.

使用25个预置位置的位置组件.
给boxaroo 2位置自动动画从第一位置移动到第二

帧动画 - 动画循环技巧

帧动画可选循环，that occur when a lightbox is typically not moving. They can add an incredible level of depth, realism and organic movement to any scenerio as well as extend opening and closing animations into more complex chained transitions.


帧动画

  • 如何工作？

有些设置具有“帧动画”设置. 这些充当 secondary/goto 动画点. 当启用时,boxaroo动画入口像往常一样, 然后完美的进行帧动画.这允许入口和出口的动画的流体的扩展以及环状的动画，同时观看内容.

高级控制

  • 迭代和方向

一旦lightbox(灯箱)已经打开动画,该帧动画将执行设定的次数. 您可以控制帧动画循环迭代或将其设置为无穷大,您还可以控制产生创意动画方向（正常，反向，交替和复用反转）。速度和缓解控制也可.

导航覆盖

  • 应用程序级别

当帧动画被应用时，导航覆盖给你强大的控制权。通常情况下，动画开始后，入口动画是完整的这允许你告诉boxaroo你想要的帧动画只在导航过程中发生, 而当它完成动画进入视野.


旋转

翻转

倾斜

缩放

translation

组合



Lightbox 运动

  • 8-方向控制

定义在哪里灯箱进入和退出 - 以你的gallery(画廊)为轴，创建很酷的效果

Lightbox 特效

  • shrink || grow || match

您还可以在入口和出口的动画控制lightbox(灯箱)的尺寸.

速度和缓动

  • 精确的动画

随着发生一次这么多的动画，Boxaroo削减了计时问题的风险消除独立的时间.

With no coding experience required, you'll
be happy to know you can leave your designer hat on

事件 - 和其他好东西

Gallery(画廊)导航

  • keyboard || mouse || finger || stylus

使用6导航事件控制互动：导航按钮、键盘、鼠标滑动、渐变叠加，触摸和滑动和滚轮.

自定义导航

  • 高级选项

控制独特的导航等方面需要刷距离、手势宽容,反向导航方向和导航轴的选择。

堆叠顺序

  • 自下而上

所有组件都分层按逻辑顺序，但如果你决定要包括自定义功能，您可以更改使用单个设置堆叠顺序.

特定设备

  • 提供什么是重要的

基于设备的用户的类型是（智能手机，平板或台式机/笔记本电脑），boxaroo可以提供设备特定的内容创意或性能的目的.

Class 分配

  • 添加更多样式

每个组件都可以有动态分配的自定义类。不受Boxaroo控制的任何CSS3动画将被应用和动画。.

显示控制

  • go ahead...调整窗口的大小

浏览器的边缘和lightbox(灯箱)之间的距离。boxaroo自动计算你的一切流畅、实时缩放.

6 可定制的导航内容的方法
导航按钮，键盘，鼠标滑动操作，渐变叠加，触摸和滑动鼠标和滚轮

灵活性——幻灯片,钩子等等

幻灯片

  • 定制并启用

幻灯片保留所有lightbox设置和显示独特的持续时间 - 可选关闭完成.

计数器定制

  • countdown to awesome

倒计时进度条是可选的，可以设置环状彩色动画来匹配你的灯箱lightbox(灯箱).

独立

  • not your typical slideshow

幻灯片是独立的,可以是一个或几个lightbox画廊——甚至整个画廊.


全屏模式

全屏模式移动到 Lightbox 图像到背景和移除 Lightbox. 3动画HTML元素组件允许你任何你想要的代码直接注入环境. 这使得Boxaroo处理任何内容，并保持其可扩展性和自定义选项.


> 艺术来源: ZUCO

全屏

导航

modular

幻灯片

定时器

钩子


全屏模式

  • perfect for presentations

全尺寸模式使用内容的图像叠加。使用任何的HTML元素导入您自己的代码在一个lightbox演示环境.

插件和皮肤

  • 出售您的boxaroo皮肤

Boxaroo速度快，模块化，提供了传统和现代的浏览器很好的支持。修改任何包含CSS / JSON文件，并出售自己的boxaroo皮肤.

JavaScript 钩子

  • JS痴迷者

建于并准备扩展Boxaroo的功能,你可以自信当调用自定义函数使用任何12集成的JavaScript钩子.

当遇到小型设备boxaroo调整性能并最大限度地提高内容显示大小 - 允许其上有5年以上的老智能手机完美运行