2015-02-18 3 views
1

Только что начал использовать GWD - не так уж плохо. У меня есть большинство из них под контролем (на самом деле, как правило, через DreamWeaver вы можете редактировать код напрямую вместо GWD), но не можете понять, как настроить загрузочный образ Polite Load. Кто-нибудь знает, как заполнить эти пробелы, используя изображение logo1.png? Я пробовал много вещей, но он всегда танцует всю сделку.Google Web Designer Polite Load

Вот соответствующий раздел кода инициализации Google обеспечивает:

 /** 
     * Handles the event that is dispatched after the Ad has been 
     * initialized and before the default page of the Ad is shown. 
     */ 
     function handleAdInitialized(event) { 
     // This marks the end of the polite load phase of the Ad. If a 
     // loading image was shown to the user, this is a good place to 
     // remove it. 
     } 

     window.addEventListener('DOMContentLoaded', 
     handleDomContentLoaded, false); 
     window.addEventListener('WebComponentsReady', 
     handleWebComponentsReady, false); 
     window.addEventListener('adinitialized', 
     handleAdInitialized, false); 
    })(); 

ответ

4

Согласно the Google documentation, вы должны поставить < div>, содержащий ваше изображение загрузки после < тела тега>:

<body style="visibility: hidden;"> 
    <div id="loading" class="loading-image"> 
    <img src="logo1.png"> 
    </div> 
    <gwd-doubleclick id="gwd-ad" polite-load=""> 
    ... 
    </gwd-doubleclick> 
</body> 

Затем в ручкеAdInitialised функции, удалите или спрячьте изображение < div>:

function handleAdInitialised(event) { 
    // This marks the end of the polite load phase of the Ad. If a 
    // loading image was shown to the user, this is a good place to 
    // remove it. 
    document.getElementById('loading').style.display = 'none'; 
} 

Единственная проблема, которую вы найдете здесь, это может испортить ваш предварительный просмотр в Google Web Designer.

Так в настоящее время я добавить некоторые CSS в представлении кода, чтобы скрыть изображение загрузки из стадии предварительного просмотра GWD:

/* CSS: HIDE OUR LOADING IMAGE */ 
<style> 
.loading-image { 
    display: none; 
} 
</style> 

А потом в моей главной функции во время выполнения Я заходящего атрибут отображения на " блок ", чтобы вернуть его обратно.

<script type="text/javascript" id="gwd-init-code"> 
    (function() { 
    document.body.style.opacity = "0"; 

    // SHOW OUR LOADING IMAGE AGAIN 
    document.getElementById('loading').style.display = 'block'; 

Я думаю, что это должно решить проблему.

+0

Да я код, который вы показываете от Google ссылка, которую вы предоставили aleady в файле, моя задача - это когда я редактирую этот код в DreamWeaver. Я не могу получить загрузочное изображение, которое будет отображаться во время предварительного просмотра, не загружая всю последовательность. Где я могу определить загружаемое изображение для использования? Используя 'logo1.png' в качестве примера загрузки изображения, куда он идет? Кроме того, «loading-image» не появляется в списке классов. –

+0

Есть ли у вас фрагмент рабочего кода, показывающий правильный синтаксис для загрузки и выхода из вежливой нагрузки? –

+0

обновленный код выше. Я не уверен, что вы подразумеваете под танком всей последовательности. мой класс загрузочного образа я добавил вручную в конец css, который создает GWD. Затем я устанавливаю этот класс для отображения: none, поэтому он не отображается в редакторе. Затем я устанавливаю его для отображения: блок при запуске кода (в коде gwd-init-code) вот пример полного кода http://pastebin.com/nJ0qYeyJ –

1

Только что начал использовать GWD, и у меня есть тот же вопрос. Gwd set opacity для «0» beacuse этого loding img не отображается. В gwd «gwddoubleclick_min.js» задана непрозрачность тела.

document.body.style.opacity="0" 

Я изменил;

document.getElementById("gwd-ad").style.opacity="0" 

И после того, как каждый элемент загружен в том же файле;

document.body.style.opacity="" 

замененный;

document.getElementById("gwd-ad").style.opacity="", 
document.getElementById('loading').style.display = 'none' 

Это сработало для меня. Есть ли у кого-нибудь другое решение?

0

Поскольку Бурак Шахин Эрден ответил передо мной, GWD устанавливает непрозрачность тела «0», которая, в свою очередь, скрывает div preLoad.

Добавление кода он отметил, кажется, единственный способ обойти это, мое объявление работает, как ожидается, теперь следующий сценарий:

<script type="text/javascript" id="gwd-init-code"> 
(function() { 
    document.getElementById("gwd-ad").style.opacity="0" 
    document.body.style.opacity="" 

    var gwdAd = document.getElementById('gwd-ad'); 

    document.getElementById('loading').style.display = 'block'; 

    /** 
    * Handles the DOMContentLoaded event. The DOMContentLoaded event is 
    * fired when the document has been completely loaded and parsed. 
    */ 
    function handleDomContentLoaded(event) {} 

    /** 
    * Handles the WebComponentsReady event. This event is fired when all 
    * custom elements have been registered and upgraded. 
    */ 
    function handleWebComponentsReady(event) { 
    // Start the Ad lifecycle. 
    setTimeout(function() { 
     gwdAd.initAd(); 
    }, 0); 
    } 

    /** 
    * Handles the event that is dispatched after the Ad has been 
    * initialized and before the default page of the Ad is shown. 
    */ 
    function handleAdInitialized(event) { 
    document.getElementById("gwd-ad").style.opacity="", 
    document.getElementById('loading').style.display = 'none' 
    } 

    window.addEventListener('DOMContentLoaded', 
    handleDomContentLoaded, false); 
    window.addEventListener('WebComponentsReady', 
    handleWebComponentsReady, false); 
    window.addEventListener('adinitialized', 
    handleAdInitialized, false); 
})(); 

+0

Я только что понял, что это решение не работает ожидаемый в Firefox и Safari, только Chrome-Body по-прежнему получает непрозрачность «0» – damianchapsmith

Смежные вопросы