两侧跟随广告
Posted 蔡秀芳
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了两侧跟随广告相关的知识,希望对你有一定的参考价值。
两侧跟随广告
思路:当鼠标滚动的时候左右两边广告跟着滚动
1 <div class="left"><img src="images/1.gif" alt=""/></div> 2 <div class="right"><img src="images/2.gif" alt=""/></div>
css
1 .left,.right{ 2 position: absolute; 3 top:80px; 4 } 5 .left{ 6 left: 0; 7 } 8 .right{ 9 right: 0; 10 }
jquery
1 $(function(){ 2 $(window).scroll(function () { 3 var top = $(document).scrollTop(); 4 $(".left").stop().animate({"top" : top + 50},600); 5 $(".right").stop().animate({"top" : top + 50},600); 6 7 // $(".left,.right").stop().animate({"top" : top + 50},600); 8 }); 9 });
以上是关于两侧跟随广告的主要内容,如果未能解决你的问题,请参考以下文章
JS-特效 ~ 02. 屏幕滚动事件 DTDscroll顶部悬浮导航两侧跟随广告返回顶部小火煎