Il modo più semplice per inserire in WebSite X5 un'animazione realizzata con WebAnimator 3 è sicuramente attraverso l'Oggetto Animazione HTML5. In questo caso, infatti, è sufficiente esportare l'animazione in formato .WAX5 e poi importarlo.

In alternativa, le animazioni possono essere importate in WebSite X5 utilizzando l'Oggetto Codice HTML.

Ecco i passi da seguire:

1. Crea l'animazione usando WebAnimator e salvala con un nome (es: MYANIMATION).

2. Esporta l'animazione da WebAnimator in una cartella vuota (es: C:\WA_Project).

3. In WebSite X5 inserisci un Oggetto Codice HTML in una pagina e inserisci il seguente codice HTML:

<script>
$(window).bind('resize', function () {
resizeWAObj('MYANIMATIONStage');
}).trigger('resize');

function resizeWAObj(e){
var target = $('#' + e + '.wascript');
t = $("#" + e);
i = $("#" + e + "Container").parent().width();
n = $("#" + e + "Container").parent().height();
r1 = Math.abs(i/t.width());
r2 = Math.abs(n/t.height());
fact = Math.min(r1, r2);
leftsco = (i - (t.width() * fact)) / 2;
target.attr("style", "transform:scale(" + fact + ");top:0px;left:" + leftsco + "px;");
}
</script>
<div id='MYANIMATIONStageContainer' style='position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px; margin: 0px; overflow: hidden; '>
<div id="MYANIMATIONStage" class="wascript">
<script type="text/javascript" charset="utf-8" src="MYANIMATION_resources/WA_SCRIPT.js"></script>
</div>
</div>

Ricorda di sostituire all'interno del codice il nome "MYANIMATION" con quello che hai utilizzato per la tua animazione in tutti i punti dove è presente.

4. Imposta per l'Oggetto Codice HTML la stessa altezza prevista per l'animazione in WebAnimator.

In WebAnimator puoi modificare questa impostazione agendo sulle proprietà del progetto.

5. Apri la sezione Esperto dell'Oggetto Codice HTML e aggiungi tutti i file che si trovano nella cartella "C:\WA_Project\MYANIMATION_resources". Verifica di aver impostato "MYANIMATION_resources" come percorso realtivo sul server.

Solo per il file "jquery-1.7.min.js", seleziona l'opzione "Collega il file (solo per file .js e .css)".

Nota: Se vuoi fare più in fretta nell'importare i file, inserisci il primo file ed imposta il percorso corretto. A questo punto seleziona il file appena inserito, clicca sul pulsante Aggiungi tenendo premuto il tasto CTRL e seleziona i file rimanenti per inserirli tutti in una volta.

Per ricevere supporto tecnico su WebAnimator contatta direttamente il forum dedicato: http://forum.webanimator.com .

Maggiori informazioni su WebAnimator sono disponibili su http://www.webanimator.com !