首页 > 编程 > JavaScript > 正文

jQuery网页右侧广告跟随滚动代码分享

2019-11-20 11:29:38
字体:
来源:转载
供稿:网友

两种方法都分享给大家,希望对大家的学习有所启发。

方法一:

<script type="text/javascript">// <![CDATA[ $.fn.smartFloat = function() {   var position = function(element) {     var top = element.position().top, pos = element.css("position");     $(window).scroll(function() {       var scrolls = $(this).scrollTop();       if (scrolls > top) {         if (window.XMLHttpRequest) {           element.css({             position: "fixed",             top: "10px"           });         } else {           element.css({             top: scrolls           });         }       }else {         element.css({           position: pos,           top: top         });       }     });   };   return $(this).each(function() {     position($(this));   }); };  //绑定 $("#float").smartFloat(); // ]]></script> 

方法二:

/*页面智能层浮动*/ jQuery(document).ready(function($){   var $sidebar = $(".float"),   $window = $(window),   offset = $sidebar.offset(),   topPadding = 20;   $window.scroll(function() {     if ($window.scrollTop() > offset.top) {       $sidebar.stop().animate({         marginTop: $window.scrollTop() - offset.top + topPadding       });     } else {       $sidebar.stop().animate({         marginTop: 0       });     }   }); }); <div id="float" class="float"> <h3>博主推荐</h3> 广告代码 </div>

以上就是jQuery网页右侧广告跟随滚动,仿wordpress右侧广告跟随滚动,希望对大家的学习有所帮助。

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表