Need help with popo?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

shunok
131 Stars 22 Forks 43 Commits 0 Opened issues

Description

PoPo is the grid layout tool, the best choice for runtime layout.

Services available

!
?

Need anything else?

Contributors list

# 324,935
JavaScr...
HTML
visuali...
grid-la...
43 commits

PoPo

PoPo is the grid layout tool, the best choice for runtime layout.

中文介绍

PoPo is a two dimensional grid layout library, The rows and columns of the grid system are custom defined at runtime, no CSS dependence, supports any size screen, It is especially suitable for large screen and super large screen.PoPo adopts the double layout pattern of grid and panel, it encapsulates content independent layout code, You can quickly build any complex pages without writing any HTML or CSS code.

Features

  • Custom grid system, no CSS dependence, no third party library dependency, no need to write HTML, CSS code
  • Grid system uniform and free layout && Universal panel layout && User defined layout patterns, Let layout be arbitrary.
  • Scaling, positioning, auxiliary information, grid auxiliary line, sub screen (coordinate) auxiliary line, panel auxiliary line debugging function, so that the big screen application development debugging no longer bother
  • Rapid construction of visualization applications
  • Adaptive multi screen
  • Rich configuration, debugging options and API
  • Compatible IE9+

Docs

Examples

More Examples...

Install

  1. node.js
// npm
npm install popojs  --save

// yarn yarn add popojs

  1. browser

Use

  1. node.js
var P = require('popojs');

// or

import * as P from 'popojs';

// Initialize PoPo Instance var popoInstance = P.init({ rows: 12, cols: 24 });

...

// Render to container popoInstance.addTo('container');

  1. browser
// body
...
...

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.