fix #13

aralejs · Jun 19, 2013 · 335a759 · 335a759
1 parent e79648f
commit 335a759
Show file tree

Hide file tree

Showing 6 changed files with 36 additions and 32 deletions.
diff --git a/HISTORY.md b/HISTORY.md
@@ -2,6 +2,10 @@
 
 ---
 
+## 1.2.1
+
+`tag:improved` 修改 sticky.stick 的默认 marginTop 为 0, fix [#13](https://github.com/aralejs/sticky/issues/13)
+
 ## 1.2.0
 
 `tag:improved` 优化接口, 去除 event 依赖, 增加 callback 参数. 简化两个 position 判断.  [#11](https://github.com/aralejs/sticky/issues/11)

diff --git a/dist/sticky-debug.js b/dist/sticky-debug.js
@@ -1,4 +1,4 @@
-define("arale/sticky/1.2.0/sticky-debug", [ "$-debug" ], function(require, exports, module) {
+define("arale/sticky/1.2.1/sticky-debug", [ "$-debug" ], function(require, exports, module) {
     var $ = require("$-debug"), doc = $(document), stickyPrefix = [ "-webkit-", "-ms-", "-o-", "-moz-", "" ], // 只需判断是否是 IE 和 IE6
     ua = (window.navigator.userAgent || "").toLowerCase(), isIE = ua.indexOf("msie") !== -1, isIE6 = ua.indexOf("msie 6") !== -1, guid = 0;
     var _isPositionStickySupported = checkPositionStickySupported(), _isPositionFixedSupported = checkPositionFixedSupported();
@@ -12,7 +12,6 @@ define("arale/sticky/1.2.0/sticky-debug", [ "$-debug" ], function(require, expor
         if (!elem.length || elem.data("bind-fixed")) return;
         // 记录元素原来的位置
         self._originTop = elem.offset().top;
-        self._originLeft = elem.offset().left;
         self.marginTop = $.isNumeric(self.options.marginTop) ? Math.min(self.options.marginTop, self._originTop) : self._originTop;
         self._originStyles = {
             position: null,
@@ -49,11 +48,12 @@ define("arale/sticky/1.2.0/sticky-debug", [ "$-debug" ], function(require, expor
         // 当距离小于等于预设的值时
         // 将元素设为 fix 状态
         if (!elem.data("_fixed") && distance <= marginTop) {
+            var offsetLeft = elem.offset().left;
             self._addPlaceholder();
             elem.css({
                 position: "fixed",
                 top: marginTop,
-                left: self._originLeft
+                left: offsetLeft
             });
             elem.data("_fixed", true);
             $.isFunction(self.options.callback) && self.options.callback.call(self, true);
@@ -116,7 +116,7 @@ define("arale/sticky/1.2.0/sticky-debug", [ "$-debug" ], function(require, expor
         this._stickyId = guid++;
     }
     Sticky.prototype.render = function() {
-        var self = this, elem = self.elem = $(self.options.element), tmp = "";
+        var self = this, elem = self.elem = $(self.options.element);
         // 一个元素只允许绑定一次
         if (!elem.length || elem.data("bind-fixed")) return;
         // 记录元素原来的位置
@@ -132,10 +132,6 @@ define("arale/sticky/1.2.0/sticky-debug", [ "$-debug" ], function(require, expor
                 self._originStyles[style] = elem.css(style);
             }
         }
-        for (var i = 0; i < stickyPrefix.length; i++) {
-            tmp += "position:" + stickyPrefix[i] + "sticky;";
-        }
-        elem[0].style.cssText += tmp + "top: " + self.marginTop + "px;";
         self._supportSticky();
         $(window).on("scroll." + self._stickyId, function() {
             if (!elem.is(":visible")) return;
@@ -145,9 +141,13 @@ define("arale/sticky/1.2.0/sticky-debug", [ "$-debug" ], function(require, expor
         return self;
     };
     Sticky.prototype._supportSticky = function() {
-        var self = this, elem = self.elem, originTop = self._originTop, marginTop = self.marginTop;
+        var self = this, elem = self.elem, originTop = self._originTop, marginTop = self.marginTop, tmp = "";
         var distance = originTop - doc.scrollTop();
         if (!elem.data("_fixed") && distance <= marginTop) {
+            for (var i = 0; i < stickyPrefix.length; i++) {
+                tmp += "position:" + stickyPrefix[i] + "sticky;";
+            }
+            elem[0].style.cssText += tmp + "top: " + self.marginTop + "px;";
             elem.data("_fixed", true);
             // 支持 position: sticky 的是不需要占位符的
             $.isFunction(self.options.callback) && self.options.callback.call(self, true);
@@ -172,7 +172,7 @@ define("arale/sticky/1.2.0/sticky-debug", [ "$-debug" ], function(require, expor
         var actual = stick.isPositionStickySupported ? Sticky : Fixed;
         return new actual({
             element: elem,
-            marginTop: marginTop,
+            marginTop: marginTop || 0,
             callback: callback
         }).render();
     }

diff --git a/dist/sticky.js b/dist/sticky.js
diff --git a/examples/index.md b/examples/index.md
@@ -56,7 +56,7 @@
 ````javascript
 seajs.use(["$", "sticky"], function($, sticky) {
     // sticky
-    sticky.stick("#stick", 30, function(status) {
+    sticky.stick("#stick", 0, function(status) {
         if (status) {
             seajs.log("stick");
         } else {
@@ -65,14 +65,14 @@ seajs.use(["$", "sticky"], function($, sticky) {
     });
 
     // fixed
-    $('<div id="gotop">回到顶部</div>').appendTo("body");
-    sticky.fix("#gotop");
+    //$('<div id="gotop">回到顶部</div>').appendTo("body");
+    //sticky.fix("#gotop");
 
-    $('<div id="nav">顶层fixed导航</div>').appendTo("body");
-    sticky.fix("#nav");
+    //$('<div id="nav">顶层fixed导航</div>').appendTo("body");
+    //sticky.fix("#nav");
 
-    $('<div id="bottom">footer fixed</div>').appendTo("body");
-    sticky.fix("#bottom");
+    //$('<div id="bottom">footer fixed</div>').appendTo("body");
+    //sticky.fix("#bottom");
 });
 ````
 

diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
     "family": "arale",
     "name": "sticky",
-    "version": "1.2.0",
+    "version": "1.2.1",
     "keywords": ["utility"],
     "description": "实现元素跟随滚动的效果。",
     "homepage": "http://aralejs.org/sticky/",

diff --git a/src/sticky.js b/src/sticky.js
@@ -30,7 +30,6 @@ define(function (require, exports, module) {
 
         // 记录元素原来的位置
         self._originTop = elem.offset().top;
-        self._originLeft = elem.offset().left;
         self.marginTop = $.isNumeric(self.options.marginTop) ? Math.min(self.options.marginTop, self._originTop) : self._originTop;
 
 
@@ -79,12 +78,14 @@ define(function (require, exports, module) {
         // 当距离小于等于预设的值时
         // 将元素设为 fix 状态
         if (!elem.data('_fixed') && distance <= marginTop) {
+            var offsetLeft = elem.offset().left;
+
             self._addPlaceholder();
 
             elem.css({
                 position: 'fixed',
                 top: marginTop,
-                left: self._originLeft
+                left: offsetLeft
             });
 
             elem.data('_fixed', true);
@@ -107,7 +108,6 @@ define(function (require, exports, module) {
         // 将元素设为 fix 状态
         if (distance <= marginTop) {
             self._addPlaceholder();
-
             elem.css({
                 position: 'absolute',
                 top: marginTop + doc.scrollTop()
@@ -177,8 +177,7 @@ define(function (require, exports, module) {
 
     Sticky.prototype.render = function () {
         var self = this,
-            elem = self.elem = $(self.options.element),
-            tmp = "";
+            elem = self.elem = $(self.options.element);
 
         // 一个元素只允许绑定一次
         if (!elem.length || elem.data('bind-fixed')) return;
@@ -199,12 +198,6 @@ define(function (require, exports, module) {
             }
         }
 
-        for (var i = 0; i < stickyPrefix.length; i++) {
-            tmp += "position:" + stickyPrefix[i] + "sticky;";
-        }
-
-        elem[0].style.cssText += tmp + "top: " + self.marginTop + "px;";
-
         self._supportSticky();
 
         $(window).on('scroll.'+self._stickyId, function () {
@@ -220,11 +213,18 @@ define(function (require, exports, module) {
         var self = this,
             elem = self.elem,
             originTop = self._originTop,
-            marginTop = self.marginTop;
+            marginTop = self.marginTop,
+            tmp = "";
 
         var distance = originTop - doc.scrollTop();
 
         if (!elem.data('_fixed') && distance <= marginTop) {
+            for (var i = 0; i < stickyPrefix.length; i++) {
+                tmp += "position:" + stickyPrefix[i] + "sticky;";
+            }
+
+            elem[0].style.cssText += tmp + "top: " + self.marginTop + "px;";
+
             elem.data('_fixed', true);
             // 支持 position: sticky 的是不需要占位符的
             $.isFunction(self.options.callback) && self.options.callback.call(self, true);
@@ -258,7 +258,7 @@ define(function (require, exports, module) {
 
         return (new actual({
             element: elem,
-            marginTop: marginTop,
+            marginTop: marginTop || 0,
             callback: callback
         })).render();
     }