add Affix

components/affix/demo/basic.md

@@ -0,0 +1,17 @@
+# 基本
+
+- order: 0
+
+最简单的用法。
+
+---
+
+````jsx
+var Affix = antd.Affix;
+
+React.render(
+  <Affix>
+    <button className="ant-btn ant-btn-primary">offset=0</button>
+  </Affix>
+, document.getElementById('components-affix-demo-basic'));
+````

components/affix/demo/offset.md

@@ -0,0 +1,17 @@
+# 偏移
+
+- order: 1
+
+达到一定的偏移量才触发。
+
+---
+
+````jsx
+var Affix = antd.Affix;
+
+React.render(
+  <Affix offset="200">
+    <button className="ant-btn ant-btn-primary">offset=200</button>
+  </Affix>
+, document.getElementById('components-affix-demo-offset'));
+````

components/affix/index.jsx

@@ -0,0 +1,62 @@
+import React from 'react';
+import joinClasses from 'react/lib/joinClasses';
+import rcUtil from 'rc-util';
+
+var Affix = React.createClass({
+
+  getDefaultProps() {
+    return {
+      offset: 0
+    };
+  },
+
+  getInitialState() {
+    return {
+      affix: false
+    };
+  },
+
+  handleScroll() {
+    var affix = this.state.affix;
+    var offset = this.props.offset;
+    var scrollTop = (document.documentElement && document.documentElement.scrollTop) ||
+    document.body.scrollTop;
+
+    if (!affix && scrollTop >= offset) {
+      this.setState({
+        affix: true
+      });
+    }
+
+    if (affix && scrollTop < offset) {
+      this.setState({
+        affix: false
+      });
+    }
+  },
+
+  componentDidMount() {
+    this.scrollEvent = rcUtil.Dom.addEventListener(window, 'scroll', this.handleScroll);
+  },
+
+  componentWillUnmount() {
+    if (this.scrollEvent) {
+      this.scrollEvent.remove();
+    }
+  },
+
+  render() {
+    var affix = this.state.affix ? 'affix' : '';
+    var className = this.props.className;
+
+    return (
+      <div {...this.props} className={joinClasses(className, affix)}>
+        {this.props.children}
+      </div>
+    );
+  }
+
+});
+
+module.exports = Affix;
+

components/affix/index.md

@@ -5,3 +5,10 @@
 
 ---
 
+## API
+
+属性如下
+
+| 成员        | 说明           | 类型               | 默认值       |
+|-------------|----------------|--------------------|--------------|
+| offset     | 达到指定偏移量后触发   | Number | 0        |

index.js

@@ -1,6 +1,7 @@
 require('./style/index.less');
 
 var antd = {
+  Affix: require('./components/affix'),
   Datepicker: require('./components/datepicker'),
   Tooltip: require('./components/tooltip'),
   Tabs: require('./components/tabs'),

package.json

@@ -56,7 +56,8 @@
     "rc-table": "~3.1.0",
     "rc-tabs": "~5.2.0",
     "rc-tooltip": "~2.4.0",
-    "rc-tree": "~0.10.0"
+    "rc-tree": "~0.10.0",
+    "rc-util": "~2.0.3"
   },
   "devDependencies": {
     "autoprefixer-loader": "~2.0.0",