Add onTopHandler functionality.

README.md

@@ -56,16 +56,39 @@ Example: `activeOverlay: '#00FFFF'`. <a href="http://markgoodyear.com/labs/scrol
 New feature in v2.0.0. Display the `scrollUp` element either the set distance from the top (default),
 or from the bottom of the page.
 
+### Events
+
+All events, which plugin provides, concluded in `scrollup` events namespace. Plugin provides following events:
+
+Event             | Description
+-------------     | -------------
+`ontop.scrollup`  | Fires when page completly scroll to top.
+
+For example:
+```js
+$.scrollUp.destroy();
+$(window).on('ontop.scrollup', function() {
+  console.log('On top.');
+});
+```
+You can detach all events for namespace:
+```js
+$(window).off('.scrollup');
+```
+or specify paticular event:
+```js
+$(window).off('ontop.scrollup');
+```
+
 ### Destroy method
 
 New feature in v2.0.0. If you need to destroy the instance of scrollUp,
-simple use the following to remove all modifications to the DOM:
+simple use the following to remove all modifications to the DOM, and detach all events:
 
 ```js
 $.scrollUp.destroy();
 ```
 
-
 ## Fully Customizable
 ScrollUp is fully customisable via CSS which makes it simple to fit right into your project.
 Simply target the scrollUp's generated ID in your CSS file and set your styles.

demo/css/labs.css

@@ -168,7 +168,8 @@ p {
     color: #FAEFDE;
 }
 
-#toggleActive {
+#toggleActive,
+#toggleOntopEvent {
     padding: 10px;
     width: 100%;
     text-align: center;
@@ -186,7 +187,8 @@ p {
     border-radius: 6px;
 }
 
-#toggleActive.active {
+#toggleActive.active,
+#toggleOntopEvent.active {
     background-color: #F66169;
     color: #FAEFDE;
 }

demo/index.html

@@ -98,6 +98,20 @@
                         .text(text)
                         .toggleClass('active');
                 });
+
+                $('#toggleOntopEvent').click(function() {
+                    var text = $(this).text() == 'Detach ontop.scrollup event' ? 'Attach ontop.scrollup event' : 'Detach ontop.scrollup event';
+                    $(this)
+                        .text(text)
+                        .toggleClass('active');
+                    if ($(this).hasClass('active')) {
+                        $(window).on('ontop.scrollup', function() {
+                            alert('On top.');
+                        });
+                    } else {
+                        $(window).off('ontop.scrollup');
+                    }
+                });
             });
 
         </script>
@@ -132,6 +146,10 @@ <h2>activeOverlay Demo</h2>
 
             <div style="clear:both"></div>
 
+            <h2>Events Demo</h2>
+            <p>For demo purposes, toggle the <code>ontop.scrollup</code> event.</p>
+            <a id="toggleOntopEvent">Attach ontop.scrollup event</a>
+
             <h2>Dummy content</h2>
             <p><strong>Dummy content to ensure the page is long enough to scroll on all screen sizes.</strong></p>
 

dist/jquery.scrollUp.js

@@ -105,6 +105,7 @@
                 if (triggerVisible) {
                     $self[animOut](animSpeed);
                     triggerVisible = false;
+                    $(window).trigger('ontop.scrollup');
                 }
             }
         });
@@ -144,7 +145,7 @@
         scrollTitle: false,          // Set a custom <a> title if required. Defaults to scrollText
         scrollImg: false,            // Set true to use image
         activeOverlay: false,        // Set CSS color to display scrollUp active point, e.g '#00FFFF'
-        zIndex: 2147483647           // Z-Index for the overlay
+        zIndex: 2147483647,          // Z-Index for the overlay
     };
 
     // Destroy scrollUp plugin and clean all modifications to the DOM
@@ -156,10 +157,13 @@
         // If 1.7 or above use the new .off()
         if ($.fn.jquery.split('.')[1] >= 7) {
             $(window).off('scroll', scrollEvent);
+            // remove scrollup events namespace
+            $(window).off('.scrollup');
 
         // Else use the old .unbind()
         } else {
             $(window).unbind('scroll', scrollEvent);
+            $(window).unbind('ontop.scrollup');
         }
     };
 

package.json

@@ -33,13 +33,13 @@
     "back to top"
   ],
   "devDependencies": {
-    "del": "^1.1.1",
+    "del": "^2.0.2",
     "gulp": "^3.8.11",
     "gulp-header": "^1.2.2",
     "gulp-jshint": "^1.9.4",
     "gulp-rename": "^1.2.0",
     "gulp-uglify": "^1.1.0",
-    "jshint-stylish": "^1.0.1"
+    "jshint-stylish": "^2.0.1"
   },
   "engines": {
     "node": ">=0.10.3"

src/jquery.scrollUp.js

@@ -99,6 +99,7 @@
                 if (triggerVisible) {
                     $self[animOut](animSpeed);
                     triggerVisible = false;
+                    $(window).trigger('ontop.scrollup');
                 }
             }
         });
@@ -138,7 +139,7 @@
         scrollTitle: false,          // Set a custom <a> title if required. Defaults to scrollText
         scrollImg: false,            // Set true to use image
         activeOverlay: false,        // Set CSS color to display scrollUp active point, e.g '#00FFFF'
-        zIndex: 2147483647           // Z-Index for the overlay
+        zIndex: 2147483647,          // Z-Index for the overlay
     };
 
     // Destroy scrollUp plugin and clean all modifications to the DOM
@@ -150,10 +151,13 @@
         // If 1.7 or above use the new .off()
         if ($.fn.jquery.split('.')[1] >= 7) {
             $(window).off('scroll', scrollEvent);
+            // remove scrollup events namespace
+            $(window).off('.scrollup');
 
         // Else use the old .unbind()
         } else {
             $(window).unbind('scroll', scrollEvent);
+            $(window).unbind('ontop.scrollup');
         }
     };