react-scroll - npm Package Compare versions

Comparing version 1.0.7 to 1.0.8

lib/mixins/Helpers.js

@@ -21,4 +21,16 @@ "use strict";
         offset: React.PropTypes.number,
+        delay: React.PropTypes.number,
         onClick: React.PropTypes.func
       },
+    scrollTo : function(to) {
+      if (this.props.delay) {
+        var _self = this;
+        clearTimeout(this.timeout);
+        this.timeout = setTimeout(function() {
+          scroller.scrollTo(to, _self.props.smooth, _self.props.duration, _self.props.offset);  
+        }, _self.props.delay)
+      } else {
+        scroller.scrollTo(to, this.props.smooth, this.props.duration, this.props.offset);  
+      }
+    },
 
@@ -30,3 +42,11 @@ getDefaultProps: function() {
       scrollTo : function(to) {
-        scroller.scrollTo(to, this.props.smooth, this.props.duration, this.props.offset);
+        if (this.props.delay) {
+          var props = this.props
+          clearTimeout(this.timeout);
+          this.timeout = setTimeout(function() {
+            scroller.scrollTo(to, props.smooth, props.duration, props.offset);  
+          }, props.delay);
+        } else {
+          scroller.scrollTo(to, this.props.smooth, this.props.duration, this.props.offset);
+        }
       },
@@ -33,0 +53,0 @@

package.json

 {
   "name": "react-scroll",
-  "version": "1.0.7",
+  "version": "1.0.8",
   "description": "A scroll component for React.js",
@@ -5,0 +5,0 @@ "main": "lib",

README.md

@@ -54,2 +54,5 @@ ## React Scroll
   },
+  scrollToBottom: function() {
+    scroll.scrollToBottom();
+  },
   scrollTo: function() {
@@ -59,3 +62,3 @@ scroll.scrollTo(100);
   scrollMore: function() {
-    scroll.scrollMore(10);
+    scroll.scrollMore(100);
   },
@@ -65,5 +68,14 @@ render: function () {
       <div>
-        <Link activeClass="active" to="test1" spy={true} smooth={true} offset={50} duration={500} >Test 1</Link>
-        <DirectLink className="test6" to="anchor" spy={true} smooth={true} duration={500}>Test 6 (anchor)</DirectLink>
-        <Button activeClass="active" className="btn" type="submit" value="Test 2" to="test2" spy={true} smooth={true} offset={50} duration={500} >Test 2</Button>
+        <Link activeClass="active" to="test1" spy={true} smooth={true} offset={50} duration={500} >
+          Test 1
+        </Link>
+        <Link activeClass="active" to="test1" spy={true} smooth={true} offset={50} duration={500} delay={1000}>
+          Test 2 (delay)
+        </Link>
+        <DirectLink className="test6" to="anchor" spy={true} smooth={true} duration={500}>
+          Test 6 (anchor)
+        </DirectLink>
+        <Button activeClass="active" className="btn" type="submit" value="Test 2" to="test2" spy={true} smooth={true} offset={50} duration={500} >
+          Test 2
+        </Button>
 
@@ -84,7 +96,7 @@ <Element name="test1" className="element">
         <br/>
-        <a onClick={this.scrollToTop}>To bottom!</a>
+        <a onClick={this.scrollToBottom}>To the bottom!</a>
         <br/>
         <a onClick={this.scrollTo}>Scroll to 100px from the top</a>
         <br/>
-        <a onClick={this.scrollMore}>Scroll 10px more from the current position!</a>
+        <a onClick={this.scrollMore}>Scroll 100px more from the current position!</a>
       </div>
@@ -102,2 +114,31 @@ );
 
+### Props
+
+> activeClass - class applied when element is reached
+
+> to - target to scroll to
+
+> spy - make Link selected when scroll is at it's targets position
+
+> smooth - animate the scrolling
+
+> offset - scroll additional px ( like padding )
+
+> duration - time of the scroll animation
+
+> delay - wait x seconds before scroll
+
+```js
+<Link activeClass="active" 
+      to="target" 
+      spy={true} 
+      smooth={true} 
+      offset={50} 
+      duration={500} 
+      delay={1000}
+>
+  Your name
+</Link>
+```
+
 ### Scroll Methods
@@ -104,0 +145,0 @@

No alert changes

Improved metrics

Total package byte prevSize

33140

increased by4.88%

Lines of code

788

increased by2.6%

Number of lines in readme file

260

increased by18.72%

No dependency changes