全球主机交流论坛

标题: 求大神指点，糗事百科右侧多个广告悬停，怎么实现的 [打印本页]

---

作者: 云生    时间: 2014-8-16 12:30
标题: 求大神指点，糗事百科右侧多个广告悬停，怎么实现的


Flash: http://www.qiushibaike.com/
打开糗事百科网，右侧至少有三个内容实现了悬停效果，而不重叠。

一个是自站的内容，一个是淘宝广告，一个是百度广告，
怎么实现三个广告都能悬停啊！

---

作者: 过往    时间: 2014-8-16 12:38

1. 
   
2. <li id="piaofu" style="margin-top:-100px; "><h3>赞助商</h3>
   
3. <div class="textwidget">
   
4. 广告内容！
   
5. </div>
   
6. </div>
   
7. </li>

复制代码

做成一个JS文件引用到网站

1. jQuery(document).ready(function($){
   
2. 
   
3. $(function() {
   
4. var $sidebar = $("#piaofu"),
   
5. $window = $(window),
   
6. offset = $sidebar.offset(),
   
7. topPadding = 10;
   
8. $window.scroll(function() {
   
9. if ($window.scrollTop() > offset.top) {
   
10. $sidebar.stop().animate({
    
11. marginTop: $window.scrollTop() - offset.top + topPadding
    
12. });
    
13. } else {
    
14. $sidebar.stop().animate({
    
15. marginTop: 0
    
16. });
    
17. }
    
18. });
    
19. });
    
20. 
    
21. });

复制代码

---

作者: 云生    时间: 2014-8-16 12:51
谢谢你，但是你这个代码，测试后无效

---

作者: ali727    时间: 2014-8-16 13:23
这个是根据滚动条来判断漂浮的。

---

作者: 云生    时间: 2014-8-16 13:40

ali727 发表于 2014-8-16 13:23
这个是根据滚动条来判断漂浮的。

我分析它的代码，怎么也不明白，代码好像很正常。

---

欢迎光临 全球主机交流论坛 (https://loc.888543.xyz/)

Powered by Discuz! X3.4