Hvordan lage en animert 3D Logo i Javascript

Bruk Javascript er setInterval funksjon for å lage en animert 3-D-logoen i et program som viser logo bilder laget i en 3-D modellering program. Den setInterval funksjonen fungerer ved gjentatte ganger å kalle en funksjon du angir i sin første argumentet på det tidspunktet du angir i det andre argumentet. Dette intervallet er satt i millisekunder, så hvis du ønsker et halvt sekund lapse mellom hvert bilde, skriv "500" for dette argumentet. For å gjøre logoen animasjon jevnere, bruke 3-D modellering program for å lage flere bilder for programmet å animere.

Bruksanvisning

1 Åpne en 3-D modellering program som Blender, Sketchup eller AutoCAD. Bruk programmets tekst verktøy for å lage en 3-D logo. Les programmets hjelpefilen for detaljerte instruksjoner.

2 Lagre logoen som "logo1.jpg" og deretter bruke programmet "Orbit" verktøyet for å rotere utsiktspunktet der du ser logoen. Lagre logoen med filnavnet "logo2.jpg," roter utsiktspunktet på nytt. Lagre logoen som "logo3.jpeg."

3 Åpne WordPad eller en annen teksteditor. Lim inn følgende tom webside. Disse uttalelsene gir et rammeverk for å installere en Javascript-program for å animere logo:

<Html>
<Head>
</ Head>
<Body>
<Img id = "TheLogos" name = "TheLogos" src = "logo1.jpg">
</ Body>
</ Html>

4 Lim inn følgende kode etter "<head>" tag. Disse uttalelsene definere en Javascript-program som viser bildene du har laget med jevne mellomrom for å produsere effekten av en animert logo:

<Script type = "text / javascript">
Var imgIndex = 1;
Var logo1 = new Image ();
logo1.src = "logo1.jpg";
Var logo2 = new Image ();
logo2.src = "logo2.jpg";
Var logo3 = new Image ();
logo3.src = "logo3.jpg";
Funksjonen animateImage (x)
{
if (imgIndex == 4)
{
imgIndex = 1;
}
Var src_of_image = "logo" + imgIndex + ".jpg";
document.TheLogos.src = src_of_image;
imgIndex ++;
}
t = setInterval ( "animateImage (imgIndex)", 500);
</ Script>

5 Lagre websiden i samme dokument der du lagret 3-D logo bilder. Åpne nettleseren, klikk deretter sin "Fil" -menyen. Klikk på "Open" -kommandoen, og deretter navigere til og dobbeltklikk på websiden du lagret. Nettleseren vil åpne siden og kjøre Javascript-program på. Spinning logo animasjon vises.