rmc-align

react align ui component for mobile

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
rmc-align
061.0.06 years ago6 years agoMinified + gzip package size for rmc-align in KB

Readme

rmc-align

React Align Component. Wrapper around https://github.com/yiminghe/dom-align.
!NPM versionnpm-imagenpm-url !build statustravis-imagetravis-url !Test coveragecoveralls-imagecoveralls-url !gemnasium depsgemnasium-imagegemnasium-url !node versionnode-imagenode-url !npm downloaddownload-imagedownload-url

Development

npm install
npm start

Example

http://localhost:8100/examples/
online example: http://react-component.github.io/align/examples/

Feature

  • support ie8,ie8+,chrome,firefox,safari

Keyboard

install

rmc-align

Usage

var Align = require('rmc-align');
var ReactDOM = require('react-dom');
ReactDOM.render(<Align align={{}} target={function(){}}><div></div></Align>, container);

will align child with target when mounted or align is changed

API

props

<thead>
<tr>
    <th style="width: 100px;">name</th>
    <th style="width: 50px;">type</th>
    <th style="width: 50px;">default</th>
    <th>description</th>
</tr>
</thead>
<tbody>
    <tr>
      <td>align</td>
      <td>Object</td>
      <td></td>
      <td>same with alignConfig from https://github.com/yiminghe/dom-align</td>
    </tr>
    <tr>
      <td>onAlign</td>
      <td>function(source:HTMLElement, align:Object)</td>
      <td></td>
      <td>called when align</td>
    </tr>
    <tr>
      <td>target</td>
      <td>function():HTMLElement</td>
      <td>function(){return window;}</td>
      <td>a function which returned value is used for target from https://github.com/yiminghe/dom-align</td>
    </tr>
    <tr>
      <td>monitorWindowResize</td>
      <td>Boolean</td>
      <td>false</td>
      <td>whether realign when window is resized</td>
    </tr>
</tbody>

License

rmc-align is released under the MIT license.