我有一个用 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>