JQuery实现网页右侧随动广告特效
方法一:
<scripttype="text/javascript">//<![CDATA[ $.fn.smartFloat=function(){ varposition=function(element){ vartop=element.position().top,pos=element.css("position"); $(window).scroll(function(){ varscrolls=$(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 }); } }); });
HTML
<divid="float"class="float"> <h3>推荐</h3> 广告代码 </div>
以上2种方法都可以实现页面右侧的随动广告特效,希望对大家能够有所帮助。