(function($) { var DNG = {}; // / // 相對父級元素fixed // / DNG.parentFixed = function() { // 獲得需要fixed定位的元素 var el =$(".parent-fixed"); // 判斷是否存在 if( el.le ...
(function($) { var DNG = {}; //----------------------------------------------------/ // 相對父級元素fixed //----------------------------------------------------/ DNG.parentFixed = function() { // 獲得需要fixed定位的元素 var el =$(".parent-fixed"); // 判斷是否存在 if( el.length > 0){ el.each(function(){ $this = $(this); // 獲取父級元素 父級元素定位 父級元素高度 $this.parentOffset = $this.offsetParent(); $this.parentOffsetY = $this.parentOffset.offset().top; $this.parentHeight = $this.parentOffset.height(); // 獲取元素定位 元素高度 $this.oldPositionY = $this.positionY = $this.position().top; $this.height = $this.height(); // 計算元素滑動最大值 = 父級元素定位 + 父級元素高度 - 元素定位 - 元素高度 $this.maxScroll = $this.parentOffsetY + $this.parentHeight - $this.positionY - $this.height; // 滑動觸發事件 $(window).scroll(function(){ $this.Scroll = $(window).scrollTop(); // 判斷1：小於父級元素定位 // 判斷2：大於父級元素定位,小於滑動最大範圍 // 判斷3：大於滑動最大範圍 if( $this.Scroll < $this.parentOffsetY ){ $this.positionY = $this.oldPositionY; } else if( $this.Scroll >= $this.parentOffsetY && $this.Scroll <= $this.maxScroll ){ // 計算元素Top定位,滑動距離 - 父級元素定位 + 元素定位 $this.positionY = $this.Scroll - $this.parentOffsetY + $this.oldPositionY; } else{ $this.positionY = $this.maxScroll - $this.parentOffsetY + $this.oldPositionY; } // 改變元素定位 $this.css("top",$this.positionY); }); }); } }; //----------------------------------------------------/ // end //----------------------------------------------------/ $(document).ready(function() { DNG.parentFixed(); }); })(jQuery);
