9

我在http://development-client-server.com/ds/上使用 Google pubads,效果很好,直到您进入实际的故事页面(请参阅http://development-client-server.com/ds/ Speech-more-common-autism/ ),当右侧顶部边栏广告加载然后迅速消失时。

我已将其范围缩小到我用来粘贴左侧社交媒体栏和右侧(在 Google 广告下方)的工作列表 div 的stickySidebars 功能。但是,粘性功能应该不会影响 Google 广告吗?

这是我正在使用的 JS 函数,我已经重写了好几次(并试图说服客户不要使用它)。

<script>

// Sticky Sidebars

function stickySidebars() {   

    var length = $('.post-content').height() - $('article .sharing-links').height() + $('.post-content').offset().top;
    var lengthSidebar = $('.sticky-container').height() - $('aside .job-listings').height() + $('.sticky-container').offset().top -30;

    $(window).scroll(function () {

        // Sharing Links

        var scroll = $(this).scrollTop() + 90;
        var height = $('article .sharing-links').height() + 'px';

        if (scroll < $('.post-content').offset().top) {

            $('article .sharing-links').css({
                'position': 'absolute',
                'top': 'auto',
                'bottom': 'auto'
            });

        } else if (scroll > length) {

            $('article .sharing-links').css({
                'position': 'absolute',
                'bottom': '0',
                'top': 'auto'
            });

        } else {

            $('article .sharing-links').css({
                'position': 'fixed',
                'top': '90px',
                'height': height
            });

        }

        // Sidebar

        var heightSidebar = $('aside .job-listings').height() + 'px';

        if (scroll < $('aside .job-listings').offset().top) {

            $('aside .job-listings').css({
                'position': 'absolute',
                'top': '300px',
                'bottom': 'auto'
            });

        } else if (scroll > lengthSidebar) {

            $('aside .job-listings').css({
                'position': 'absolute',
                'bottom': '30px',
                'top': 'auto'
            });

        } else {

            if (scroll < $('.sticky-container').offset().top + 300) {

                $('aside .job-listings').css({
                    'position': 'absolute',
                    'top': '300px',
                    'bottom': 'auto'
                });

            } else {

                $('aside .job-listings').css({
                    'position': 'fixed',
                    'top': '90px',
                    'height': heightSidebar
                });
            }

        }
    });
}

$(window).on('load',function(){
    if($(window).width() > 1100){
        stickySidebars();
    } 
});

$(window).resize(function() {
    if($(window).width() > 1100){
        stickySidebars();
    }
});
</script>
4

1 回答 1

8

该问题不是由粘性侧边栏引起的。这是由这段代码引起的:

$(window).on('load',function(){
    // Other unrelated functions here...

    /*****************************/
    // Move Sidebar in Mobile
    /*****************************/

    if($(window).width() <= 980){
        $("aside").appendTo(".mobile-sidebar");
    } else {
        $("aside").insertAfter(".single-article article");
    }
});

本质上是广告加载,然后您移动容器(aside),这会导致广告消失。

有几个不同的选项,但基本上您需要 Google 广告脚本在该段代码之后运行,或者您需要刷新广告。要刷新广告,您应该能够在 if else 语句之后直接运行这行代码:

googletag.pubads().refresh()

这会刷新所有广告。根据您的设置方式,您可以将变量传递refresh()给以刷新特定广告,例如

var slot1 = googletag.pubads().display('/1234567/sports', [728, 90], 'div-1');

googletag.pubads().refresh([slot1]);

refresh() 的 Google 参考文档

于 2015-11-01T00:30:53.897 回答