Share
Edge är det senaste designverktyget för att träffa Adobe Labs. Det gör det möjligt för konstruktörer att ge animerade innehåll till webbplatser, med hjälp av webbstandarder som HTML5, JavaScript och CSS3.
Under denna introduktion kommer vi att lära känna gränssnittet, granska tidslinjen och tillämpa animering på ett verkligt projekt.
Vi börjar med att lära känna applikationsgränssnittet.
I den här snabba skärmbilden ska vi kolla in tidslinjen och bli animerad.
Under denna tredje övning kommer vi att ta det vi har lärt oss i de två tidigare videon och göra det verkligt.
Vad genererar Adobe Edge exakt vad gäller filer och kod? Tja, ett litet Edge-projekt slår ut en mapp som ser något ut så här:
Du kan tydligt se projektfilen Edge plus allt distribueringsinnehåll. Det finns en html-fil med dess medföljande css och js-filer, då en hel mängd tillgångar, inklusive jQuery, några js-verktyg och vilken import du gjorde i projektet.
När det gäller den genererade koden, kolla källan till bashtml. Det gick inte att vara enklare!
testa
Innehållet läggs alla till scenen genom javascriptfilen och manipuleras därefter.
innehåll: dom: [id: 'Rectangle1', typ: 'rekt', rekt: [88,82,119,106], fyll: ['rgba (192,192,192,1)'] 0,0,1) "," ingen "],, id: 'Bild1', typ: 'bild', rekt: [0,0,755,600], fyll: ['rgba (0,0,0,0) ',' images / Image.png '],, id:' Text1 ', typ:' text ', rekt: [155,77,0,0], text: "bit text" Arial Black, Gadget, sans-serif ", [24," "," rgba (0,0,0,1) "," normal "," none "," "],,] symbolInstances: [] ,
Accentsconagua