Added IE 7 support for anchor-targets. fixes #66

README.md

@@ -1,6 +1,6 @@
 [![Build Status](https://secure.travis-ci.org/Prinzhorn/skrollr.png)](http://travis-ci.org/Prinzhorn/skrollr)
 
-skrollr (v 0.5.2)
+skrollr (v 0.5.3)
 =====
 
 Stand-alone **parallax scrolling** lib for **mobile (Android + iPhone) and desktop** in just over **3.4k** (gzipped) for desktop. And another 6.5k for **mobile support** (which is optional).
@@ -131,6 +131,8 @@ By default the element is the element where the key frames are defined on (self)
 
 Examples: `data-anchor-target="#foo"` or `data-anchor-target=".bar:not(.bacon) ~ span > a[href]"`
 
+**Note**: If you need to support IE 7, then you may only use IDs as `anchor-target`s, i.e. `#foo`. The IE plugin maps `querySelector` to `getElementById`.
+
 Here's an infographic for better understanding of anchors (click to open PDF):
 
 [![Anchors Guide](https://raw.github.com/Prinzhorn/skrollr/master/guide/anchor-position-guide.png)](https://raw.github.com/Prinzhorn/skrollr/master/guide/anchor-position-guide.pdf)
@@ -381,6 +383,11 @@ Removes the listener for the given event.
 Changelog
 =====
 
+0.5.3
+-----
+
+* #66: Make IE 7 support a light version of `data-anchor-target` by mapping `querySelector` to `getElementById`.
+
 0.5.2
 -----
 

src/banner/skrollr.txt

@@ -1 +1 @@
-/*! skrollr v0.5.2 https://github.com/Prinzhorn/skrollr | free to use under terms of MIT license */
+/*! skrollr v0.5.3 https://github.com/Prinzhorn/skrollr | free to use under terms of MIT license */

src/plugins/skrollr.ie.js

@@ -6,9 +6,10 @@
  *
  * free to use under terms of MIT license
  */
-(function(skrollr) {
+(function(document, skrollr) {
 	var rxHSLAColor = /hsla?\(\s*(-?[\d.]+)\s*,\s*(-?[\d.]+)%\s*,\s*(-?[\d.]+)%.*?\)/g;
 	var rxRGBAColor = /rgba?\(\s*(-?[\d.]+%?)\s*,\s*(-?[\d.]+%?)\s*,\s*(-?[\d.]+%?).*?\)/g;
+	var rxID = /^#[^\s]+$/;
 
 	var _setStyle = skrollr.setStyle;
 
@@ -107,4 +108,14 @@
 		}
 	};
 
-}(window.skrollr));
+	/*
+		A really bad polyfill. But the main use-case for data-anchor-target are IDs.
+	*/
+	document.querySelector = document.querySelector || function(selector) {
+		if(!rxID.test(selector)) {
+			throw 'Unsupported selector "' + selector + '". The querySelector polyfill only works for IDs.';
+		}
+
+		return document.getElementById(selector.substr(1));
+	};
+}(document, window.skrollr));