Wku

Hur man skapar en grundläggande flash interaktiv webbsida


Med den här informationen kan du också bygga din egen hemsida. Många stora företag har utmärkta blixt webbplatser, men ändå så många små företag verkar oförmögna att utforma en slät och ren hemsida. I denna handledning kommer vi att skapa en Tropics-tema webbplats. OBS: Denna handledning förutsätter att du vet hur man använder Flash 8 eller MX.

Redigerades av Alex Dickinson 6/3/2008

Steg

Hur man skapar en grundläggande flash interaktiv webbsida. Öppna din Macromedia Flash-program och välj "nytt Flash-dokument".
Hur man skapar en grundläggande flash interaktiv webbsida. Öppna din Macromedia Flash-program och välj "nytt Flash-dokument".
  1. 1
    Öppna din Macromedia Flash-program och välj "nytt Flash-dokument".
  2. 2
    På "egenskaper" längst ned på skärmen (om du inte kan se detta, gå till fönstret -> egendom -> klicka på egendom, klicka på knappen som säger "storlek" bredvid.
  3. 3
    Ett fönster som heter "dokumentegenskaper" bör dyka upp i de två ämnena bredvid "dimensioner", fyll i 625 i bredd och 750 för längden.
  4. 4
    På samma "egenskaper" bar, ändra bakgrundsfärgen till en mjuk grön, # bae29e (använd textrutan överst i färgväljaren) är en bra nyans att använda, och klicka på OK.
  5. 5
    Skapa en symbol genom att trycka på Ctrl + F8.
  6. 6
    Namnge den "banner_mc", och ange dess typ till "filmklipp" och klicka sedan på OK.
  7. 7
    Skapa en rektangel, med ingen fyllning och ett 2-pixelstorlek gränsen, med hjälp av rektangel verktyget till vänster.
  8. 8
    Välj rektangeln som använder valet, bearbetar (default - 'v) och ange dess bredd till 750, och dess höjd till 172 med hjälp av egenskapen längst ned på skärmen.
  9. 9
    På "färgablandaren" side-rutan vid sidan av skärmen (om du inte kan se detta gå till fönstret -> färg mixer, väljer den radiella alternativ i listrutan.
  10. 10
    Längst till vänster i den radiella färg, markera ett löv färg (genom att dubbelklicka på reglaget). # 66CC00 bör fungera fint.
  11. 11
    3/4 's av vägen längs baren, placera en solid vit genom att bara klicka och dubbelklicka på den och välja vitt.
  12. 12
    Hela vägen till höger i slutet av baren, placera en tropisk kiwi färg. # 99FF66 är ett bra val här.
  13. 13
    Nu, med hjälp av verktyget Paint Bucket (default - 'k'), fyll i din banner med radiella. Där du klickar för att fylla kommer att representera mitt i din cirkel-typ design. Placering av mitten av cirkeln högst upp i baren, ca 3/4 's av vägen till den vänstra änden.
  14. 14
    Leta upp din lager bar, och kallar detta skikt "bas".
  15. 15
    Skapa ett lager med hjälp av det nya lagret knappen (längst ned i baren) - Kalla denna "text".
  16. 16
    Välj textverktyget (default - 't') till vänster, och se till att texten är inställd på "statisk text" alternativet på botten av fastigheten bar.
  17. 17
    Ange färgen på texten till svart.
  18. 18
    Välj ett typsnitt som ska användas. Några av de listade teckensnitt är skräddarsydda typsnitt, och fästena bredvid dem innehåller webbplatsen för att ladda ner dem från.
    • Scriptina (Abstrakt teckensnitt)
    • WirWenzlaw (Abstrakt teckensnitt)
    • Viner Hand ITC
    • Sylfaen
    • Monotype Corsiva
    • HandScript
    • Lucida Blackletter
    • Papyrus
  19. 19
    Skriv ditt namn på din webbplats i textfältet och hitta en lämplig storlek.
  20. 20
    Placera texten till vänster sida. Lämna tillräckligt med utrymme för att klistra in en bild.
  21. 21
    Gå in på internet, Google bilder, och skriv in "palm".
  22. 22
    Välj ett foto av en palm, som denna bitmapp: Palm tree
  23. 23
    Spara detta foto, och importera den till Flash-dokument med hjälp av fil -> import.
  24. 24
    Namnge den i biblioteket som "palm tree_bmp"
  25. 25
    Skapa en symbol (Ctrl + F8), name it palm tree_gr, och välj den grafiska knappen.
  26. 26
    Skala om bilden till dina önskemål genom att använda verktyget Omforma fritt (default - Q) till vänster på skärmen och klippa någon del av det du inte gillar ut.
  27. 27
    Gå tillbaka till bannern, och gör ett nytt lager.
  28. 28
    Kalla det "bild".
  29. 29
    Placera din handflata tree_gr, och skala den så den passar i det vänstra hörnet.
  30. 30
    Nu placera din banner_mc på scen 1.
  31. 31
    Skapa en ny symbol (Ctrl + F8), kalla det navigation_mc, och göra det till ett filmklipp.
  32. 32
    Skapa en tunn, lång rektangel för att hysa dina länkar.
  33. 33
    Döp lagret "base"
  34. 34
    Gör det ha en 2-pixelstorlek gränsen
  35. 35
    Fyll rektangeln med # 66cc00.
  36. 36
    Skapa en sekund (knapp) symbol (Ctrl + F8), kallar det "home_bt".
  37. 37
    Se tillbaka på listan över teckensnitt jag som, och väljer ett annat teckensnitt än din banner, en som ser bra ut med den andra. Se till att alla dina knappar använder samma typsnitt och storlek.
  38. 38
    Skriv "hem",
  39. 39
    Bryt isär den använda CTRL + B.
  40. 40
    Kopiera frame "up", och klistra in det i de andra ramarna.
  41. 41
    Namnge detta skikt "text".
  42. 42
    Skapa ett annat lager, kalla det "dolda".
  43. 43
    Gör en rektangel ungefär täcker din text.
  44. 44
    Ge rektangeln ingen gräns, och ange dess alpha till 0%.
  45. 45
    Kopiera rektangel ram och klistra in den på de övriga ramarna i det lagret.
  46. 46
    Gå tillbaka till navigation_mc och gör ett nytt lager.
  47. 47
    Kalla det "knappar".
  48. 48
    Sätt din knapp där.
  49. 49
    Upprepa steg 43-54 för så många knappar du behöver.
  50. 50
    Sätt en 1-pixel linje mellan dina knappar på navigation_mc, på "basen" lagret.
  51. 51
    Gå tillbaka till scen 1 och namnge lagret med din banner "banner".
  52. 52
    Skapa ett andra lager, och kalla det navigering.
  53. 53
    Placera din navigering på detta.
  54. 54
    Skapa så många bildrutor som du har knappar på din meny.
  55. 55
    Gör dem alla keyframes (genom att högerklicka på bilden och välja "Infoga nyckelbildruta", eller trycker på F6).
  56. 56
    Klicka på din navigation_mc.
  57. 57
    Klicka på din hem-knappen och öppna ActionScript genom att klicka på åtgärden panelen längst ner på skärmen eller genvägen jag använder oftast F9.
  58. 58
    Använda "expert mode" skriv in följande:
    gotoAndStop (1);
    } Detta kommer att göra det så när musen klickas och släppte det kommer att gå till bildruta 1 "och slutar.
  59. 59
    På din nästa knapp, göra detsamma, utom i "gotoAndStop" fäste, skriva nästa nummer (i sekvens).
  60. 60
    Gå tillbaka till scen 1.
  61. 61
    Öppna insatser för bildruta 1 (F9).
  62. 62
    Skriv in: stop ();
  63. 63
    Gör ett nytt lager på scen 1, och kallar det "text".
  64. 64
    Konvertera alla ramar på det lagret till keyframes, och göra så många som du behöver för att ha en keyframes som matchar dina andra lager.
  65. 65
    Gör ett textfält med hjälp av textverktyget (T), och skriva vad du vill på varje sida.
  66. 66
    Testa webbsidan, och låta vem du vill testa den.
  67. 67
    Gå till fil -.> Publicera inställningar, se till html är vald och tryck publicera. Detta kommer att publicera blixt webbplats du skapat i en html-fil för dig dit du har sparat det till. Om detta inte fungerar kontrollera att du har sparat sedan upprepa detta steg.
  68. 68
    Dubbelklicka på den fil som du publicerat (. Html), och du göras!

Tips

  • Ge dig själv en eller två dagar för att slutföra detta i. Breaking tiden upp kan göra att du glömmer var du var i handledningen.
  • Sätt inte texten på scen 1, lägga den i navigation_mc, samma med ramarna, annars knapparna är värdelösa.

Varningar

  • Kontrollera att för varje timme du spenderar på datorn, du får en halvtimmes session motion.

Saker du behöver

  • Värdtjänst
  • Flash Professional 8 eller MX
  • Minst fyra timmars tid
  • Skapande
  • Grundläggande kunskaper i Actionscript