🛠 use change event, not select; 👷 v1.0.1

🐞 fixes bug changing hash on resize
📝 revise README & description

README.md

@@ -1,32 +1,34 @@
 # Flickity hash
 
-_Enable hash navigation for Flickity_
+_Select Flickity slides with links_
 
 ## Features
 
-Connect hash links (i.e. `href="#cell2"`) to select Flickity slides.
++ Connect hash links to select Flickity slides. `<a href="#cell2">View cell 2</a>`
++ Use URLs for slides: `https://example.com/#cell2`
++ Change page hash to match selected slide.
 
-``` html
-<a href="#cell2">View cell 2</a>
-```
+## Install
 
-Use URLs for slides: `https://example.com/#cell2`
+Add `hash.js` to your scripts.
 
-Change page hash to match selected slide.
+### Download
 
-## Install
++ [hash.js](https://unpkg.com/flickity-hash@1/hash.js)
 
-### Manual
+### CDN
 
-+ Add `hash.js` to your scripts
+``` html
+<script src="https://unpkg.com/flickity-hash@1/hash.js"></script>
+```
 
 ### Package managers
 
 npm: `npm install flickity-hash`
 
 Bower: `bower install flickity-hash`
 
-## Initialize
+## Usage
 
 Enable hash behavior by setting `hash: true` in Flickity options.
 
@@ -39,7 +41,7 @@ var $carousel = $('.carousel').flickity({
 
 ``` js
 // vanilla JS
-var flkty = $('.carousel').flickity({
+var flkty = new Flickity( '.carousel', {
   hash: true,
 });
 ```
@@ -51,18 +53,44 @@ var flkty = $('.carousel').flickity({
 </div>
 ```
 
-## HTML
+### HTML
 
 Add `id` attributes to cell elements.
 
 ``` html
 <div class="carousel">
-  <div class="carousel-cell" id="cell1">...</div>
-  <div class="carousel-cell" id="cell2">...</div>
-  <div class="carousel-cell" id="cell3">...</div>
+  <div class="carousel-cell" id="carousel-cell1">...</div>
+  <div class="carousel-cell" id="carousel-cell2">...</div>
+  <div class="carousel-cell" id="carousel-cell3">...</div>
 </div>
 ```
 
+Hash links will select slides on click.
+
+``` html
+<a href="#carousel-cell2">View cell 2</a>
+```
+
+### Webpack & Browserify
+
+``` js
+var Flickity = require('flickity-hash');
+
+var flkty = new Flickity( '.carousel', {
+  hash: true,
+});
+```
+
+### RequireJS
+
+``` js
+requirejs( [ 'path/to/flickity-hash' ], function( Flickity ) {
+  var flkty = new Flickity( '.carousel', {
+    hash: true,
+  });
+});
+```
+
 ---
 
 By [Metafizzy](https://metafizzy.co) 🌈🐻

bower.json

@@ -1,6 +1,6 @@
 {
   "name": "flickity-hash",
-  "description": "Enable hash navigation for Flickity",
+  "description": "Select Flickity slides with links ",
   "main": "hash.js",
   "dependencies": {
     "flickity": "^2.1.0"

hash.js

@@ -1,5 +1,5 @@
 /*!
- * Flickity hash v1.0.0
+ * Flickity hash v1.0.1
  * Enable hash navigation for Flickity
  */
 
@@ -52,7 +52,7 @@ proto._createHash = function() {
 };
 
 proto.activateHash = function() {
-  this.on( 'select', this.onSelectHash );
+  this.on( 'change', this.onChangeHash );
 
   // overwrite initialIndex
   if ( this.options.initialIndex === undefined && location.hash ) {
@@ -67,15 +67,11 @@ proto.activateHash = function() {
 
 
 proto.deactivateHash = function() {
-  this.off( 'select', this.onSelectHash );
+  this.off( 'change', this.onChangeHash );
   this.disconnectHashLinks();
 };
 
-proto.onSelectHash = function() {
-  if ( !this.isInitActivated ) {
-    // do not set hash for initial select
-    return;
-  }
+proto.onChangeHash = function() {
   var id = this.selectedElement.id;
   if ( id ) {
     var url = '#' + id;

package.json

@@ -1,7 +1,7 @@
 {
   "name": "flickity-hash",
-  "version": "1.0.0",
-  "description": "Enable hash navigation for Flickity",
+  "version": "1.0.1",
+  "description": "Select Flickity slides with links ",
   "main": "hash.js",
   "dependencies": {
     "flickity": "^2.1.0"