Quick Tips: Ring jQuery Inside AS3 Bruke jotAQuery
Del
Del
en
Del
Denne Cyber Monday Envato Tuts + kurs vil bli redusert til bare $ 3. Ikke gå glipp av
Kommunikasjon mellom Flash og Javascript er noe enhver Action utbygger bør være kjent med.; Heldigvis finnes det klasser som kan hjelpe oss i prosessen. Les gjennom denne Quick Tips for å lære hvor enkelt det er
Trinn 1: Hvorfor vil jeg trenger Javascript
Interaktivitet?.
Fra leseren integrering (tilbake, frem knapper) til full swf manipulasjon (modifisere selve innebygd film egenskaper, parametre, etc). Begge språkene er svært kraftige og kan være enda mer så når du kombinerer dem.
Javascript Raw kan kalles ved hjelp av Ekstern Interface klassen innebygd på Actionscript 3, men tenk kraften og enkelhet av jQuery og dens forhåndslagde metoder og funksjoner. Høres bra ut, la oss se hvordan det gjøres
Trinn 2:. Actionscript + jQuery
jotAQuery er en Action port til jQuery som muliggjør bruk av jQuery-kode inne i en Actionscript 3 Klasse. De fleste av jQuery metoder er tilgjengelige for bruk, selv om noen ikke kan gjennomføres.
For å få jotAQuery til arbeidet du trenger den kompilerte Flash movie hjelp av jotAQuery klasser og HTML-filen der du vil legge ned SWF. Du må også koble jQuery biblioteket til HTML-fil.
I de neste trinnene vi kommer til å lage et enkelt eksempel som vil visne i en SWF film ved hjelp av jQuery.
< h2> Trinn 3: Last ned jotAQuery
Gå til jotAQuery google kodesett og laste ned kildefilene. Du må bla gjennom kilden for å få de tre nødvendige filene som de ikke er merket i downloads delen
Trinn 4:. Action
Gjør klar en ny Action klasse og skrive inn følgende kode:
pakke {import flash.display.Sprite; import com.singuerinc.as3.external. *; offentlig siste klasse Hoved strekker Sprite {public endelige funksjonen main () {/* Eksempel Call * //* $ ('# flash') slideUp (300).; * //* Du kan også laste inn koden ved hjelp av denne syntaksen * /jQuery.execute (< jQuery > < [CDATA [$ ('# flash') css (!. {Opacity: 0}); $ ('# flashinnhold ') .animate ({opacity: 1}, 2000);]] > < /jQuery >); }}}
Link denne filen som dokumentet klassen i FLA og fortsette til HTML del
Trinn 5:. HTML
Du kan bruke standard HTML-fil eksportert av Flash (merk HTML boksen i Publiser Åpne filen og se effekten lever Opplev kraften av jQuery og prøve forskjellige eksempler på samhandling. Jeg håper du likte denne Quick Tips, takk for lesing!
menyen), bare koble til din jQuery kildefilen:
DOCTYPE html PUBLIC "- //W3C //DTD XHTML 1.0 Strict //EN" "! http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns = "http://www.w3.org/1999/xhtml" lang = "no" xml : lang = "no" > < head > < title > jotAQuery < /title > < meta http-equiv = "Content-Type" content = "text /html; charset = utf-8" /> < style type = "text /css" media = "screen" > html, body {width: 100%; høyde: 100%; background-color: #ffffff;} body {margin: 0; padding: 0; flow: hidden; } #flashContent {Width: 600px; høyde: 300px; margin: 0 auto;} < /style > <! - Legg jQuery Script - > < script type = "text /javascript" src = "http://code.jquery.com/jquery-1.4.1.min.js" > < /script > < /head > < body > < div id = "flash" >! ... html fortsetter her
Konklusjon