首頁  >  文章  >  web前端  >  隨窗體滑動的小插件sticky源碼_javascript技巧

隨窗體滑動的小插件sticky源碼_javascript技巧

WBOY
WBOY原創
2016-05-16 17:31:49943瀏覽

複製程式碼程式碼如下:

  {
                var $obj                    = parseInt($obj.parent().css('padding-top'));
               var .offset( ).top;
                var opts            lockBottom:true }, options);

                $obj.css( { 位置: '絕對' });

                if(opts.lockBottom){
   ight() - $obj.height() ParentPaddingTop;
if( 底部位置                                        $(window).scroll(function () {
             
                    var pastStartOffset                        var objFartherThanTopPos    = $obj.offset().top >起始偏移量;  
       = $obj. outerHeight()
                         var newpos = ($(document).scrollTop() -startOffset opts.offsetY );            = BottomPos;

                       if ( $(document).scrollTop             newpos = ParentPaddingTop;

               

}

});
};




使用方法很簡單:只要在頁面中引入該插件,然後用選擇器呼叫>


複製程式碼

程式碼如下:

$('#menu15').stickyfloat({ duration: 500 });
$('#menu14').stickyfloat({ duration: 500 });
$('# menu13').stickyfloat({ duration: 500 });
$('#menu12').stickyfloat({ duration: 500 });

   二下的duration參數表示滑動的速度,越大越慢。
陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn