0

我有一个用 python/django/html 编写的关于 Google App 引擎的网站。站点位于http://perlesloyfer.no 它是一种博客,展示了一些我制作的弓的人的图像。我在顶部实施了一个“粘性标题”,并在帖子的第 9 位显示广告。但是,当我滚动列表时,Google Ads 会以某种方式迫使它们自己位于标题的顶部。此图像位于问题的底部。

是什么原因造成的,是否可以解决?我希望广告像其他帖子一样滚动,但它不应该显示,因为它在该位置时“超过”标题。

粘性标题 jquery 代码:

$(function(){
    // Check the initial Poistion of the Sticky Header
    var stickyHeaderTop = $('#sticky').offset().top;
    $(window).scroll(function(){
        if( $(window).scrollTop() > stickyHeaderTop ) {
            //$('#sticky').css({position: 'fixed', top: '0px', float: 'right'});
            $('#sticky').addClass("sticky");
        } else {
            $('#sticky').removeClass("sticky");
        }
    });
});

标题的实际 HTML:

<div id="sticky" class="top-area">
<div class="main-header"><a href="./">Perlesløyfer</a></div>
<div class="main-subheader"><p>Av Håkon Bogen</p></div>
<div class="tabs">
    <ul>
        <li><a href=".">Bilder</li></a>
        <li><a class="selected" href="./about">Om</li></a>
        <li><a href="http://epla.no/handlaget/produkter/526979/">Kjøp</li></a>
        <li><a href="./submit">Last opp</li></a>
    </ul>
</div>

用于粘性的 CSS:

#sticky {
    background-color: white;
    position:fixed;
    top:0;
    width:100%;
}

谷歌广告代码:

<div class="commercial" id="page-wrap-ad">
    <p id="ads">
<!---  google_ad_client = ....  -->
<script type="text/javascript">
    <script type="text/javascript"
            src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
    </script></p>

网站显示正确

谷歌广告显示错误

4

2 回答 2

0

不确定我是否可以发布这个,但这里是:

在问题中找到广告的特定目标元素(div、类等),并使用 CSS 覆盖其定位。

Example:
#myAnnoyingAd{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
}
于 2012-12-13T19:32:21.187 回答
0

刚刚为粘性标题添加了更大的 z-index。没有比那更难。

#sticky {
    background-color: white;
    position:fixed;
    top:0;
    width:100%;
    z-index:1000;
}
于 2012-12-14T09:19:35.533 回答