Användarhandbok Avbryt

Använd inbyggda JavaScript-beteenden

Sök
Dreamweaver

Dreamweaver

Öppna appen
  1. Användarhandbok för Dreamweaver
  2. Introduktion
    1. Grunderna i responsiv webbdesign
    2. Nyheter i Dreamweaver
    3. Webbutveckling med Dreamweaver – översikt
    4. Dreamweaver/vanliga frågor
    5. Kortkommandon
    6. Systemkrav för Dreamweaver
    7. Sammanfattning av funktioner
  3. Dreamweaver och Creative Cloud
    1. Synka inställningarna för Dreamweaver med Creative Cloud
    2. Creative Cloud Libraries i Dreamweaver
    3. Använda Photoshop-filer i Dreamweaver
    4. Arbeta med Adobe Animate och Dreamweaver
    5. Extrahera webboptimerade SVG-filer från bibliotek
  4. Arbetsytor och vyer i Dreamweaver
    1. Arbetsytan i Dreamweaver
    2. Optimera Dreamweaver-arbetsytan för visuell utveckling
    3. Söka efter filer baserat på filnamn eller innehåll | Mac OS
  5. Skapa webbplatser
    1. Om Dreamweaver-platser
    2. Skapa en lokal version av din webbplats
    3. Ansluta till en publiceringsserver
    4. Ställa i ordning en testserver
    5. Importera och exportera inställningarna för en Dreamweaver-plats
    6. För över befintliga webbplatser från en fjärrserver till din lokala platsrot
    7. Tillgänglighetsfunktioner i Dreamweaver
    8. Avancerade inställningar
    9. Ange platsinställningar för överföring av filer
    10. Ange proxyserverinställningar i Dreamweaver
    11. Synka inställningarna för Dreamweaver med Creative Cloud
    12. Använda Git i Dreamweaver
  6. Hantera filer
    1. Skapa och öppna filer
    2. Hantera filer och mappar
    3. Hämta och skicka filer till och från servern
    4. Checka in och checka ut filer
    5. Synka filer
    6. Jämför skillnader mellan filer
    7. Dölja filer och mappar på din Dreamweaver-plats
    8. Aktivera Design Notes för Dreamweaver-platser
    9. Sätta stopp för Gatekeeper
  7. Layout och design
    1. Använda visuella hjälpmedel för layout
    2. Layouta sidor med CSS
    3. Designa responsiva webbplatser med Bootstrap
    4. Skapa och använda mediefrågor i Dreamweaver
    5. Visa innehåll med tabeller
    6. Färger
    7. Responsiv design med flytande stödrasterlayouter
    8. Extract i Dreamweaver
  8. CSS
    1. Förstå Cascading Style Sheets (CSS)
    2. Utforma sidor med hjälp av CSS Designer
    3. Använda CSS-förbehandlare i Dreamweaver
    4. Ange CSS-formatinställningar i Dreamweaver
    5. Flytta CSS-regler i Dreamweaver
    6. Konvertera infogad CSS till en CSS-regel i Dreamweaver
    7. Arbeta med div-taggar
    8. Använda övertoningar på bakgrunden
    9. Skapa och redigera CSS3-övergångseffekter i Dreamweaver
    10. Formatera kod
  9. Sidinnehåll och resurser
    1. Ange sidegenskaper
    2. Ange CSS-rubrikegenskaper och CSS-länkegenskaper
    3. Arbeta med text
    4. Sök och ersätt text, taggar och attribut
    5. DOM-panel
    6. Redigera i live-vyn
    7. Koda dokument i Dreamweaver
    8. Markera och visa element i dokumentfönstret
    9. Ange textegenskaper i egenskapskontrollen
    10. Stavningskontrollera en webbsida
    11. Använda vågräta linjer i Dreamweaver
    12. Lägga till och ändra teckensnittskombinationer i Dreamweaver
    13. Arbeta med resurser
    14. Infoga och uppdatera datum i Dreamweaver
    15. Skapa och hantera favoritresurser i Dreamweaver
    16. Infoga och redigera bilder i Dreamweaver
    17. Lägga till medieobjekt
    18. Lägga till videor i Dreamweaver
    19. Infoga HTML5-video
    20. Infoga SWF-filer
    21. Lägga till ljudeffekter
    22. Infoga HTML5-ljud i Dreamweaver
    23. Arbeta med biblioteksobjekt
    24. Använda arabisk och hebreisk text i Dreamweaver
  10. Länkar och navigering
    1. Om länkar och navigering
    2. Länkning
    3. Bildmappningar
    4. Felsöka länkar
  11. jQuery-widgetar och effekter
    1. Använda jQuery-gränssnitt och mobilwidgetar i Dreamweaver
    2. Använd jQuery-effekter i Dreamweaver
  12. Koda webbplatser
    1. Om kodning i Dreamweaver
    2. Kodningsmiljön i Dreamweaver
    3. Ange kodningspreferenser
    4. Anpassa kodfärger
    5. Skriva och redigera kod
    6. Kodtips och kodkomplettering
    7. Komprimera och utöka kod
    8. Återanvända kod med fragment
    9. Granska kod
    10. Optimera kod
    11. Redigera kod i designvyn
    12. Arbeta med head-innehåll för sidor
    13. Infoga SSI i Dreamweaver
    14. Använda taggbibliotek i Dreamweaver
    15. Importera egna taggar i Dreamweaver
    16. Använda JavaScript-beteenden (allmänna instruktioner)
    17. Använda inbyggda JavaScript-beteenden
    18. Om XML och XSLT
    19. Utföra XSL-omvandlingar på servern i Dreamweaver
    20. Utföra XSL-omvandlingar på klienten i Dreamweaver
    21. Lägga till teckenentiteter för XSLT i Dreamweaver
    22. Formatera kod
  13. Arbetsflöden mellan produkter
    1. Installera och använda tillägg i Dreamweaver
    2. Uppdateringar i appen i Dreamweaver
    3. Infoga Microsoft Office-dokument i Dreamweaver (endast Windows)
    4. Använda Fireworks och Dreamweaver
    5. Redigera innehåll på Dreamweaver-webbplatser med Contribute
    6. Integrering mellan Dreamweaver och Business Catalyst
    7. Skapa anpassade e-postkampanjer
  14. Mallar
    1. Om Dreamweaver-mallar
    2. Känna igen mallar och mallbaserade dokument
    3. Skapa en Dreamweaver-mall
    4. Skapa ändringsbara regioner i mallar
    5. Skapa upprepande regioner och tabeller i Dreamweaver
    6. Använd valfria regioner i mallar
    7. Definiera redigerbara taggattribut i Dreamweaver
    8. Skapa kapslade mallar i Dreamweaver
    9. Redigera, uppdatera och ta bort mallar
    10. Exportera och importera XML-innehåll i Dreamweaver
    11. Lägga till eller ta bort en mall från ett befintligt dokument
    12. Redigera innehåll i Dreamweaver-mallar
    13. Syntaxregler för malltaggar i Dreamweaver
    14. Ange markeringsinställningar för mallområden
    15. Fördelar med att använda mallar i Dreamweaver
  15. Mobiler och flera skärmar
    1. Skapa mediefrågor
    2. Ändra sidorientering för mobila enheter
    3. Skapa webbappar för mobila enheter med Dreamweaver
  16. Dynamiska webbplatser, sidor och webbformulär
    1. Förstå webbprogram
    2. Konfigurera datorn för programutveckling
    3. Felsöka databasanslutningar
    4. Ta bort anslutningsskript i Dreamweaver
    5. Utforma dynamiska sidor
    6. Översikt över källor med dynamiskt innehåll
    7. Definiera källor med dynamiskt innehåll
    8. Lägga till dynamiskt innehåll på sidor
    9. Ändra dynamiskt innehåll i Dreamweaver
    10. Visa databasposter
    11. Ange och felsöka livedata i Dreamweaver
    12. Lägga till anpassade serverbeteenden i Dreamweaver
    13. Bygga formulär med Dreamweaver
    14. Använda formulär för att samla in information från användarna
    15. Skapa och aktivera ColdFusion-formulär i Dreamweaver
    16. Skapa webbformulär
    17. Förbättrat HTML5-stöd för formulärelement
    18. Använda Dreamweaver för att utveckla ett formulär
  17. Bygga program visuellt
    1. Bygga huvud- och detaljsidor i Dreamweaver
    2. Bygga sök- och resultatsidor
    3. Bygga en postinmatningssida
    4. Bygga en postuppdateringssida i Dreamweaver
    5. Bygga postborttagningssidor i Dreamweaver
    6. Förändra en databas med hjälp av ASP-kommandon i Dreamweaver
    7. Bygga en registreringssida
    8. Bygga en inloggningssida
    9. Bygga en sida som bara behöriga användare har åtkomst till
    10. Skydda mappar i ColdFusion med Dreamweaver
    11. Använda ColdFusion-komponenter i Dreamweaver
  18. Testa, förhandsgranska och publicera webbplatser
    1. Förhandsgranska sidor
    2. Förhandsgranska Dreamweaver-webbsidor på flera enheter
    3. Testa Dreamweaver-platsen
  19. Felsökning
    1. Korrigerade problem
    2. Kända fel

 

 

Det här ämnet förklarar hur du använder inbyggda JavaScript-beteenden i Adobe Dreamweaver.

Använd inbyggda beteenden

De beteenden som Dreamweaver är utrustat med har skrivits så att de fungerar i de flesta moderna webbläsare. I äldre webbläsare misslyckas beteendena utan att orsaka fel.

Obs!

Dreamweaver-åtgärderna har konstruerats noga så att de fungerar i så många webbläsare som möjligt. Om du tar bort kod från en Dreamweaver-åtgärd manuellt eller byter ut den mot egen kod kanske kompatibiliteten försämras.

Även om Dreamweaver-åtgärderna har skrivits för att maximera kompatibiliteten mellan olika webbläsare, saknar vissa webbläsare helt stöd för JavaScript och många användare surfar med JavaScript inaktiverat i sina webbläsare. Bäst resultat för alla plattformar uppnår du genom att tillhandahålla ett alternativt gränssnitt inom <noscript>-taggar, så att användare utan JavaScript kan använda din webbplats.

Använda beteendet Anropa JavaScript

Beteendet Anropa JavaScript är ett sätt att köra en specialfunktion eller JavaScript-kodrad då en händelse inträffar. (Du kan skriva skriptet själv eller återanvända kod som du hittar i diverse gratis JavaScript-bibliotek på Internet.)

  1. Markera ett objekt och välj Anropa JavaScript på menyn Lägg till beteende i panelen Beteenden.
  2. Skriv JavaScript-koden som ska köras eller namnet på en funktion.

    Om du till exempel vill skapa en Bakåt-knapp skriver du if (history.length > 0){history.back()}. Om du har kapslat in koden i en funktion behöver du bara skriva dess namn (till exempel hGoBack()).

  3. Klicka på OK och kontrollera att standardhändelsen är den rätta.

Använda beteendet Ändra egenskap

Använd beteendet Ändra egenskap om du vill ändra värdet på ett objekts egenskaper (till exempel bakgrundsfärgen för en div eller åtgärden för ett formulär).

Obs!

Du bör bara använda det här beteendet om du har goda kunskaper i HTML och JavaScript.

  1. Markera ett objekt och välj Ändra egenskap på menyn Lägg till beteende i panelen Beteenden.
  2. Välj en elementtyp på menyn Elementtyp om du vill visa alla namngivna element av den typen.
  3. Markera ett element på menyn Element-ID.
  4. Välj en egenskap på menyn Egenskap eller ange dess namn i rutan.
  5. Ange den nya egenskapens nya värde i fältet Nytt värde.
  6. Klicka på OK och kontrollera att standardhändelsen är den rätta.

Använda beteendet Kontrollera plugin-program

Använd beteendet Kontrollera plugin-program om du vill visa besökarna olika sidor beroende på om det angivna plugin-programmet är installerat eller inte. Kanske vill du att besökarna ska hamna på en sida om Shockwave är installerat och på en annan i annat fall, till exempel.

Obs!

Det går inte att identifiera särskilda plugin-program i Internet Explorer via JavaScript. Väljer du Flash eller Director infogas emellertid den VBScript-kod som krävs för att identifiera plugin-programmen i Internet Explorer i Windows. Det går inte att identifiera plugin-program i Internet Explorer på Mac OS.

  1. Markera ett objekt och välj Kontrollera plug-in på menyn Lägg till beteende i panelen Beteenden.
  2. Välj ett plugin-program på menyn Plugin-program eller klicka på Enter och ange programmets namn i rutan bredvid.

    Du måste ange plugin-programmets exakta namn, precis så som det visas på sidan Om plugin-program i Netscape Navigator. (I Windows ska du välja kommandot Hjälp > Om plugin-program i Navigator och på Mac OS ska du välja Om plugin-program på Apple-menyn.)

  3. Ange till vilken adress du vill att besökarna som har plugin-programmet ska föras i rutan Om den hittas, gå till URL.

    Om du anger en adress till en annan server måste du skriva http:// framför adressen. Om du lämnar fältet tomt blir besökarna kvar på samma sida.

  4. Ange till vilken alternativ adress du vill att besökarna som inte har plugin-programmet ska föras i rutan I annat fall, gå till URL. Om du lämnar fältet tomt blir besökarna kvar på samma sida.
  5. Ange vad som ska ske om det inte går att identifiera plugin-programmet. Om identifiering inte är möjlig sänds besökaren vidare till adressen i rutan I annat fall, om du inte anger något annat. Vill du i stället att besökaren ska komma till den första (Om den hittas) adressen ska du välja alternativet Gå alltid till första URL-adressen om identifieringen inte är möjlig. Markerar du det här alternativet förutsätter du i princip att besökaren har plugin-programmet, såvida inte webbläsaren uttryckligen meddelar att den inte är installerad. Välj det här alternativet om det som plugin-programmet visar är viktigt för sidan. Låt det annars vara omarkerat.
    Obs!

    Det här alternativet gäller enbart Internet Explorer. Netscape Navigator kan alltid identifiera plugin-program.

  6. Klicka på OK och kontrollera att standardhändelsen är den rätta.

Använda beteendet Dra AP-element

Med hjälp av beteendet Dra AP-element kan en besökare dra ett absolut positionerat (AP) element. Använd det här beteendet om du vill skapa pussel, skjutreglage och andra flyttbara element i gränssnittet.

Du kan ange i vilken riktning besökaren kan dra AP-elementet (vågrätt, lodrätt eller i vilken riktning som helst), ett mål som besökaren måste dra AP-elementet till, om AP-elementet ska låsas till målet om det är inom ett visst antal pixlar av målet, vad som ska ske när AP-elementet når målet och så vidare.

Eftersom beteendet Dra AP-element måste anropas innan besökaren kan dra AP-elementet, bör du koppla beteendet Dra AP-element till body-objektet (med händelsen onLoad).

  1. Välj Infoga > Layoutobjekt > AP-div eller klicka på knappen Rita AP-div på panelen Infoga och rita en AP-div i dokumentfönstrets designvy.
  2. Klicka på <body> i kodväljaren i dokumentfönstrets nedre vänstra hörn.
  3. Välj Dra AP-element på menyn Lägg till beteende i panelen Beteenden.

    Om Dra AP-element inte är tillgängligt, har du förmodligen markerat ett AP-element.

  4. Markera AP-elementet på snabbmenyn AP-element.
  5. Välj antingen Begränsad eller Obegränsad på snabbmenyn Rörelse.

    Obegränsad förflyttning är lämpligt för pussel och andra dra-och-släpp-spel. För skjutreglage och flyttbara dekorationer som arkivlådor, draperier och små rullgardiner ska du välja begränsad förflyttning.

  6. Om du väljer begränsad förflyttning ska du ange värden (pixlar) i rutorna Uppåt, Nedåt, Vänster och Höger.

    Värdena är relativa till AP-elementets startpunkt. Om du vill begränsa förflyttningarna till en rektangulär region ska du ange positiva värden i alla fyra rutorna. Om du bara vill tillåta vertikal förflyttning ska du ange positiva värden i Uppåt och Nedåt och värdet 0 i Vänster och Höger. Om du bara vill tillåta horisontell förflyttning ska du ange positiva värden i Vänster och Höger och värdet 0 i Nedåt och Uppåt.

  7. Ange värden (i pixlar) för släppområdet i rutorna Vänster och Överkant.

    Släppområdet är det ställe dit du vill att besökaren ska dra AP-elementet. Ett AP-element anses ha nått släppområdet när dess vänstra och övre koordinat har de värden som du har angett i rutorna Vänster och Överkant. Värdena är i relation till webbläsarens övre vänstra hörn. Klicka på Hämta aktuell position om du vill att textrutorna ska uppdateras med AP-elementets aktuella position.

  8. Ange ett värde (i pixlar) i rutan Fäst om inom. Det bestämmer hur långt bort från släppområdet AP-elementet får vara innan det fästs mot målet.

    Högre värden gör det enklare för besökaren att hitta släppområdet.

  9. För enkla pussel och manipulation av ett sceneri behövs inget mer. Om du vill definiera AP-elementets draghandtag, hålla reda på AP-elementets elementförflyttning medan det dras samt utlösa en åtgärd när AP-elementet släpps, klickar du på fliken Avancerat.
  10. Om du vill ange att besökaren måste klicka på ett visst område i AP-elementet innan det går att dra någonstans, väljer du Område i element på Draghandtag-menyn. Ange sedan draghandtagets vänstra och övre koordinater och dess bredd och höjd.

    Det här alternativet är bra att använda om bilden i AP-elementet innehåller ett element som visar att den går att förflytta, som till exempel en namnlist eller ett draghandtag. Ange inte det här alternativet om du vill att användaren ska kunna dra AP-elementet genom att klicka var som helst i det.

  11. Välj vilka alternativ för Medan det dras som du vill använda:

    • Välj Lägg elementet längst fram om AP-elementet ska flyttas längst fram i staplingsordningen då det dras. Använder du det här alternativet anger du på snabbmenyn om AP-elementet ska lämnas kvar längst fram eller återställas till sin ursprungliga plats i staplingsordningen.

    • Ange JavaScript-kod eller ett funktionsnamn (till exempel monitorAPelement()) i rutan Anropa JavaScript, om du vill att koden eller funktionen ska utföras upprepade gånger medan AP-elementet dras. Du skulle till exempel kunna skriva en funktion som övervakar AP-elementets koordinater och visar tips som ”nu bränns det” eller ”du är långt från släppområdet” i en textruta.

  12. Ange JavaScript-kod eller ett funktionsnamn (till exempel evaluateAPelementPos()) i den andra Anropa JavaScript-rutan, om du vill att koden eller funktionen ska utföras när AP-elementet släpps. Markera Endast vid fäst om skriptet bara ska köras om AP-elementet har nått släppområdet.
  13. Klicka på OK och kontrollera att standardhändelsen är den rätta.

Hämta information om det dragbara AP-elementet

När du kopplar beteendet Dra AP-element till ett objekt, infogas funktionen MM_dragLayer() av Dreamweaver i dokumentets head-avsnitt. (Funktionen behåller den gamla namnkonventionen för AP-element [d.v.s. ”Lager”] så att lager som skapats i tidigare versioner av Dreamweaver fortfarande ska kunna redigeras.) Utöver att registrera AP-elementet som dragbart, definierar den här funktionen tre egenskaper för alla AP-element – MM_LEFTRIGHT, MM_UPDOWN och MM_SNAPPED – som du kan använda i dina egna JavaScript-funktioner för att avgöra AP-elementets relativa vågräta position, dess relativa lodräta position samt om det har nått släppområdet.

Obs!

Informationen som vi lämnar här är endast avsedd för erfarna JavaScript-programmerare.

Med följande funktion visas MM_UPDOWN-egenskapens (aktuell vertikal position för AP-elementet) värde i formulärfältet curPosField. (Formulärfält är användbara när du vill visa information som uppdateras kontinuerligt eftersom de är dynamiska. Det betyder att deras innehåll kan ändras efter att sidan har lästs in.)

function getPos(layerId){ 
    var layerRef = document.getElementById(layerId); 
    var curVertPos = layerRef.MM_UPDOWN; 
    document.tracking.curPosField.value = curVertPos; 
}

I stället för att visa värdena för MM_UPDOWN eller MM_LEFTRIGHT i ett formulärfält kan du använda värdena på en mängd andra vis. Du skulle till exempel kunna skriva en funktion som visar ett meddelande i formulärfältet, vars innehåll avgörs av hur nära värdet befinner sig släppområdet. Du skulle även kunna anropa en annan funktion för att visa eller dölja ett AP-element beroende på det aktuella värdet.

Det är särskilt användbart att läsa av egenskapen MM_SNAPPED när du har flera AP-element på sidan, som alla måste ha nått sina mål innan besökaren kan gå vidare till nästa sida eller uppgift. Du kan till exempel skriva en funktion som räknar hur många AP-elements MM_SNAPPED-värden som har värdet true och anropa den när ett AP-element släpps. När antalet fästa element uppnår ett förutbestämt tal skulle du kunna skicka besökaren vidare till nästa sida eller visa ett gratulationsmeddelande.

Använda beteendet Gå till URL

Beteendet Gå till URL gör att en ny sida visas i det aktuella fönstret eller i den angivna ramen. Det här beteendet lämpar sig för att ändra innehållet i två eller fler ramar genom ett musklick.

  1. Markera ett objekt och välj Gå till URL på menyn Lägg till beteende i panelen Beteenden.
  2. Välj ett mål för webbadressen i listan Öppna i.

    Listan Öppna i innehåller namnen på alla ramar i den aktuella ramuppsättningen men även huvudfönstret. Om det inte finns några ramar är huvudfönstret det enda alternativet.

    Obs!

    Det här beteendet kan ge märkliga resultat om någon av ramarna heter top, blank, self eller parent. Vissa webbläsare tar miste på dessa namn och tror att de är reserverade målnamn.

  3. Välj ett dokument som du vill öppna genom att klicka på Bläddra eller ange sökvägen och filnamnet på dokumentet i rutan URL.
  4. Upprepa steg 2 och 3 om du vill visa ytterligare dokument i andra ramar.
  5. Klicka på OK och kontrollera att standardhändelsen är den rätta.

Använda beteendet Hoppmeny

När du skapar en hoppmeny genom att använda Infoga > Formulär > Hoppmeny skapar Dreamweaver ett menyobjekt och kopplar beteendet Hoppmeny (eller Hoppmeny Gå) till det. Normalt finns det ingen anledning att koppla beteendet Hoppmeny till ett objekt manuellt.

Du kan redigera en befintlig hoppmeny på två olika sätt:

  • Du kan redigera och ändra ordning på menyalternativ, ändra filerna som du vill hoppa till samt ange i vilket fönster filerna öppnas genom att dubbelklicka på beteendet Hoppmeny på panelen Beteenden.

  • Du kan redigera menyalternativen precis som på en vanlig meny. Välj menyalternativet och använd knappen Listvärden i Egenskapskontrollen.

  1. Skapa ett hoppmenyobjekt om dokumentet ännu inte innehåller något.
  2. Markera objektet och välj Hoppmeny på menyn Lägg till beteende i panelen Beteenden.
  3. Gör de ändringar du önskar i dialogrutan Hoppmeny och klicka sedan på OK.

Använda beteendet Hoppmeny Gå

Beteendet Hoppmeny Gå är nära besläktat med beteendet Hoppmeny. Med det förra går det att koppla en Gå-knapp till en hoppmeny. (Innan du använder det här beteendet måste det redan finnas en hoppmeny i dokumentet.) Om du klickar på Gå-knappen öppnas den valda länken på hoppmenyn. En hoppmeny behöver normalt inte ha någon Gå-knapp. Det brukar räcka med att välja ett alternativ på en hoppmeny. Då öppnas URL:en utan att användaren behöver göra något mer. Men om besökaren väljer alternativet som redan är markerat i hoppmenyn händer ingenting. Det spelar i normala fall ingen roll, men om hoppmenyn finns i en ram och menyalternativen länkar till sidor i andra ramar kan en Gå-knapp vara bra att ha. Det gör att besökarna kan välja ett alternativ som redan är markerat på hoppmenyn en gång till.

Obs!

När du använder en Gå-knapp med en hoppmeny, blir Gå-knappen den enda mekanism som överför användaren till den URL som är associerad med menyvalet. Att markera ett menyalternativ på hoppmenyn dirigerar inte längre om användaren automatiskt till en annan sida eller ram.

  1. Markera ett objekt som du vill använda som Gå-knapp (normalt en knappbild) och välj Hoppmeny Gå på menyn Lägg till beteende på panelen Beteenden.
  2. Välj en meny som Gå-knappen ska aktivera på menyn Välj hoppmeny och klicka sedan på OK.

Använda beteendet Öppna webbläsarfönster

Använd beteendet Öppna webbläsarfönster om du vill öppna en sida i ett nytt fönster. Du kan ange det nya fönstrets egenskaper, bland annat dess storlek, attribut (huruvida det går att ändra storlek på, har en menyrad och så vidare) och namn. Du kan till exempel använda det här beteendet om du vill öppna en större bild i ett separat fönster då besökaren klickar på en miniatyrbild. Med det här beteendet kan du se till att det nya fönstret blir exakt lika stort som bilden.

Om du inte anger några attribut för fönstret blir det lika stort och har samma attribut som fönstret det öppnades från. Om du anger något attribut för fönstret inaktiveras alla övriga attribut som du inte uttryckligen aktiverar. Säg att du inte anger några fönsterattribut. Fönstret kan då bli 1024 x 768 pixlar stort och ha ett navigeringsfält (med knapparna Föregående, Nästa, Hem och Läs in igen), ett platsfält (där URL:en visas), ett statusfält (längst ned där statusmeddelanden visas) och en menyrad (med Arkiv, Redigera, Visa och andra menyer). Om du uttryckligen anger att bredden ska vara 640 och höjden 480 men inte anger några andra attribut blir fönstret 640 x 480 pixlar stort men saknar verktygsfält.

  1. Markera ett objekt och välj Öppna webbläsarfönster på menyn Lägg till beteende i panelen Beteenden.
  2. Välj en fil efter att ha klickat på Bläddra eller ange adressen till den sida du vill visa.
  3. Ange fönstret bredd och höjd (i pixlar) och huruvida du vill att det ska vara utsmyckat med diverse verktygsfält, rullningslister, storleksändringshandtag och liknande. Ge fönstret ett namn (använd inga mellanslag eller specialtecken) om du vill att det ska kunna vara ett länkmål eller vill kunna kontrollera det via JavaScript.
  4. Klicka på OK och kontrollera att standardhändelsen är den rätta.

Använda beteendet Popup-meddelande

Beteendet Popup-meddelande visar en JavaScript-varning med det meddelande som du anger. Eftersom det bara finns en knapp i JavaScript-varningar (OK) ska du använda det här beteendet om du vill ge användaren information. Det går inte att välja något.

Du kan infoga giltiga JavaScript-anrop, egenskaper, globala variabler och andra uttryck i texten. Om du vill infoga ett JavaScript-uttryck måste det stå inom klamrar ({}). Vill du visa en klammer infogar du ett omvänt snedstreck före klammern (\{).

Exempel:

The URL for this page is {window.location}, and today is {new Date()}.
Obs!

Webbläsaren bestämmer hur varningen ser ut. Om du vill ha bättre kontroll över utseendet kanske du hellre vill använda beteendet Öppna webbläsarfönster.

  1. Markera ett objekt och välj Popup-meddelande på menyn Lägg till beteende i panelen Beteenden.
  2. Skriv meddelandet i rutan Meddelande.
  3. Klicka på OK och kontrollera att standardhändelsen är den rätta.

Använda beteendet Förhandsladda bilder

Beteendet Förhandsladda bilder minskar den tid det tar att visa bilder genom att bilder som inte visas direkt när sidan visas (till exempel bilder som visas som resultat av beteenden eller skript) cachelagras.

Obs!

Beteendet Förhandsladda bilder gör att alla bilder hämtas automatiskt om du väljer alternativet Förhandsladda bilder i dialogrutan Växla bild. Du behöver alltså inte lägga till Förhandsladda bilder själv om du använder Växla bild.

  1. Markera ett objekt och välj Förhandsladda bilder på menyn Lägg till beteende i panelen Beteenden.
  2. Välj en bildfil genom att klicka på Bläddra eller ange bildens sökväg och filnamn i rutan Bildkällfil.
  3. Klicka på plusknappen (+) högst upp i dialogrutan så att bilden läggs till i listan Förhandsladda bilder.
  4. Upprepa steg 2 och 3 för alla bilder som återstår och som du vill förhandsladda på den aktuella sidan.
  5. Om du vill ta bort en bild från listan Förhandsladda bilder ska du markera den och klicka på minusknappen (–).
  6. Klicka på OK och kontrollera att standardhändelsen är den rätta.

Använda beteendet Ange texten i ramen

Med beteendet Ange texten i ramen kan du ange en rams text och därmed ändra dess innehåll och format med något annat. Innehållet kan vara valfri HTML-kod. Använd det här beteendet om du vill visa information dynamiskt.

Även om beteendet Ange texten i ramen gör att formatet i en ram ersätts kan du välja Bevara bakgrundsfärg om du vill bevara attributen för sidans bakgrund och textfärg.

Du kan infoga giltiga JavaScript-anrop, egenskaper, globala variabler och andra uttryck i texten. Om du vill infoga ett JavaScript-uttryck måste det stå inom klamrar ({}). Vill du visa en klammer infogar du ett omvänt snedstreck före klammern (\{).

Exempel:

The URL for this page is {window.location}, and today is {new Date()}.
  1. Markera ett objekt och välj Ange text > Ange texten i ramen på menyn Lägg till beteende i panelen Beteenden.
  2. Välj målramen på Ram-menyn i dialogrutan Ange texten i ramen.
  3. Klicka på knappen Hämta aktuell HTML så att det aktuella innehållet från målramens body-sektion.
  4. Skriv ett meddelande i rutan Ny HTML.
  5. Klicka på OK och kontrollera att standardhändelsen är den rätta.

Använda beteendet Ange texten i behållaren

Beteendet Ange texten i behållaren ersätter en befintlig behållares innehåll och format (det vill säga alla element som kan innehålla text eller andra element) på en sida med det innehåll du anger. Innehållet kan vara valfri HTML-källkod.

Du kan infoga giltiga JavaScript-anrop, egenskaper, globala variabler och andra uttryck i texten. Om du vill infoga ett JavaScript-uttryck måste det stå inom klamrar ({}). Vill du visa en klammer infogar du ett omvänt snedstreck före klammern (\{).

Exempel:

The URL for this page is {window.location}, and today is {new Date()}.
  1. Markera ett objekt och välj Ange text > Ange texten i behållaren på menyn Lägg till beteende i panelen Beteenden.
  2. Välj målram på menyn Behållare i dialogrutan Ange text i behållaren.
  3. Ange den nya texten eller HTML-koden i rutan Ny HTML.
  4. Klicka på OK och kontrollera att standardhändelsen är den rätta.

Använda beteendet Ange texten i statusfältet

Med beteendet Ange texten i statusfältet kan du visa ett meddelande i statusfältet längst ned till vänster i webbläsarens fönster. Ett användningsområde för det här beteendet är att beskriva vart en länk för besökaren och visa meddelandet i statusfältet i stället för webbadressen som hör till länken. Besökarna struntar i eller missar ofta meddelanden i statusfältet (och inte alla webbläsare har fullständigt stöd för att ange texten där). Om det är ett viktigt meddelande bör du kanske visa det i ett popup-meddelande eller som text i ett AP-element.

Obs!

Om du använder beteendet Ange texten i statusfältet i Dreamweaver, är det inte säkert att texten i webbläsarens statusfält ändras, eftersom särskilda inställningar krävs för att ändra texten i statusfältet i vissa webbläsare. Firefox kräver till exempel att användaren ändrar ett avancerat alternativ som tillåter JavaScript att ändra statusfältets text. Mer information finns i dokumentationen för din webbläsare.

Du kan infoga giltiga JavaScript-anrop, egenskaper, globala variabler och andra uttryck i texten. Om du vill infoga ett JavaScript-uttryck måste det stå inom klamrar ({}). Vill du visa en klammer infogar du ett omvänt snedstreck före klammern (\{).

Exempel:

The URL for this page is {window.location}, and today is {new Date()}.
  1. Markera ett objekt och välj Ange text > Ange texten i statusfältet på menyn Lägg till beteende i panelen Beteenden.
  2. Skriv meddelandet i rutan Meddelande i dialogrutan Ange texten i statusfältet.

    Var kortfattad. Webbläsaren klipper av meddelandet om det inte får plats i statusfältet.

  3. Klicka på OK och kontrollera att standardhändelsen är den rätta.

Använda beteendet Ange texten i textfältet

Med beteendet Ange texten i textfältet ersätts innehållet i ett textfält i ett formulär med den text som du anger.

Du kan infoga giltiga JavaScript-anrop, egenskaper, globala variabler och andra uttryck i texten. Om du vill infoga ett JavaScript-uttryck måste det stå inom klamrar ({}). Vill du visa en klammer infogar du ett omvänt snedstreck före klammern (\{).

Exempel:

The URL for this page is {window.location}, and today is {new Date()}.

Skapa ett textfält med ett namn

  1. Välj Infoga > Formulär > Textfält.

    Klicka på Ja om du får en fråga om du vill lägga till en formulärtagg av Dreamweaver.

  2. Ange textfältets namn i egenskapskontrollen. Namnet måste vara unikt på sidan (ge inte flera element på sidan samma namn, inte ens om de är i olika formulär).

Använda Ange texten i textfältet

  1. Markera ett textfält och välj Ange text > Ange texten i textfältet på menyn Lägg till beteende i panelen Beteenden.
  2. Välj måltextfältet på menyn Textfält och skriv den nya texten.
  3. Klicka på OK och kontrollera att standardhändelsen är den rätta.

Använda beteendet Visa-dölj element

Med beteendet Visa-dölj element kan du visa, dölja eller återställa ett eller flera AP-elements normala synlighetsvärde. Det här beteendet lämpar sig för att visa information då användaren gör något på sidan. Anta att användaren flyttar pekaren till en bild av en växt. Då skulle du kunna visa ett sidelement med information om dess växtsäsong och odlingsområde, om den behöver stå i sol eller klarar sig i halvskugga eller skugga, hur hög den blir och så vidare. Det här beteendet visar eller döljer bara elementet i fråga, det tar inte egentligen bort elementet från sidflödet när det döljs.

  1. Markera ett objekt och välj Visa-dölj element på menyn Lägg till beteende i panelen Beteenden.

    Om Visa-dölj element inte är tillgängligt, har du förmodligen markerat ett AP-element. Eftersom AP-element inte accepterar händelser i båda 4.0-webbläsarna, måste du ange ett annat objekt, som <body>-taggen eller en länk (<a>-tagg).

  2. Markera det element som du vill visa eller dölja i listan Element och klicka på Visa, Dölj eller Återställ (vilket återställer standardsynligheten).
  3. Upprepa steg 2 för alla återstående element vars synlighet du vill ändra. (Du kan ändra synligheten för flera AP-element med ett och samma beteende.)
  4. Klicka på OK och kontrollera att standardhändelsen är den rätta.

Det här beteendet används inte i Dreamweaver CS5.

Använda beteendet Växla bild

Med beteendet Växla bild byts en bild ut mot en annan, vilket sker genom att attributet src i <img>-taggen ändras. Använd det här beteendet om du vill skapa överrullningseffekter för knappar eller andra bildeffekter (och även om du vill byta mer än en bild åt gången). Om du infogar en överrullningsbild läggs beteendet Växla bild automatiskt till på sidan.

Obs!

Eftersom bara attributet src påverkas av beteendet, bör du bara växla till en bild som har samma dimensioner (höjd och bredd) som den ursprungliga bilden. I annat fall förminskas eller förstoras den bild som du växlar in så att den passar den ursprungliga bildens mått.

Det finns även ett beteende som heter Växla bildåterställning. Det återställer den senaste uppsättningen växlade bilder till de ursprungliga källfilerna. Det här beteendet läggs till automatiskt om du lägger till beteendet Växla bild till ett objekt. Om du låter alternativet Återställ vara aktiverat då du kopplar in beteendet Växla bild bör du aldrig behöva välja beteendet Växla bildåterställning manuellt.

  1. Välj Infoga > Bild eller klicka på knappen Bild på panelen Infoga om du vill infoga en bild.
  2. Ange bildens namn i den vänstra textrutan i egenskapskontrollen.

    Du behöver inte ge bilder namn; de får automatiskt ett namn om du kopplar ett beteende till dem. Det är emellertid enklare att skilja på bilderna i dialogrutan Växla bild om du ger alla bilder namn på förhand.

  3. Upprepa steg 1 och 2 om du vill lägga till fler bilder.
  4. Markera ett objekt (i allmänhet den bild som du vill byta ut) och välj Växla bild på menyn Lägg till beteende i panelen Beteenden.
  5. Välj den bild vars källfil du vill ändra i listan Bilder.
  6. Välj en ny bildfil genom att klicka på Bläddra eller ange den nya bildens sökväg och filnamn i rutan Ange källa till.
  7. Upprepa steg 5 och 6 för alla andra bilder som du vill ändra. Använd samma Växla bild-åtgärd för alla bilder som du vill ändra på en gång. I annat fall återställs inte alla av motsvarande Växla bildåterställning-åtgärd.
  8. Markera alternativet Förhandsladda bilder om du vill att de nya bilderna ska cachelagras medan sidan läses in.

    På så sätt slipper du vänta då det är dags för de nya bilderna att visas.

  9. Klicka på OK och kontrollera att standardhändelsen är den rätta.

Använda beteendet Ändra egenskap

Med beteendet Validera formulär kan du kontrollera innehållet i angivna textfält och se till att användaren har angett data i rätt format. Koppla det här beteendet till enskilda textfält med händelsen onBlur om fälten ska valideras medan användaren fyller i formuläret, eller koppla det till formuläret med hjälp av händelsen onSubmit om flera textfält ska verifieras samtidigt när användaren klickar på Skicka. Om du kopplar det här beteendet till ett formulär går det inte att skicka in formulär med felaktiga data.

  1. Välj Infoga > Formulär eller klicka på knappen Formulär på panelen Infoga om du vill infoga ett formulär.
  2. Välj Infoga > Formulär > Textfält eller klicka på knappen Textfält på panelen Infoga om du vill infoga ett textfält.

    Upprepa proceduren om du vill lägga till fler textfält.

  3. Välj en verifieringsmetod:

    • Markera ett textfält och välj Fönster > Beteenden om du vill verifiera enskilda fält medan användaren fyller i formuläret.

    • Om flera fält ska verifieras när användaren skickar formuläret, klickar du på <form>-taggen i taggväljaren i dokumentfönstrets nedre, vänstra hörn och väljer sedan Fönster > Beteenden.

  4. Välj Validera formulär på menyn Lägg till beteende.
  5. Gör något av följande:

    • Validerar du enskilda fält, markerar du det fält som du markerade i listan Fält i dokumentfönstret.

    • Validerar du flera fält på en gång, markerar du ett textfält i listan Fält.

  6. Markera alternativet Obligatorisk om fältet måste innehålla data.
  7. Välj något av följande alternativ för Acceptera:

    Vad som helst

    Ett obligatoriskt fält måste innehålla data, men uppgifterna kan vara i vilket format som helst. 

    E-postadress

    Fältet måste innehålla symbolen @.

    Skriv in en siffra

    Fältet får bara innehålla siffror.

    Skriv in en siffra från

    Fältet måste innehålla ett tal i det angivna intervallet.

  8. Om du validerar flera fält på en gång, upprepar du steg 6 och 7 för alla ytterligare fält som du vill validera.
  9. Klicka på OK.

    Om du validerar flera fält när användaren skickar formuläret, visas händelsen onSubmit automatiskt på Händelse-menyn.

  10. Om du validerar enskilda händelser, kontrollerar du att standardhändelsen är onBlur eller onChange. Välj någon av dessa händelser om de inte är markerade.

    Bägge händelserna utlöser beteendet Validera formulär då användaren flyttar från det aktuella fältet. Skillnaden är att onBlur inträffar oavsett om användaren har angett ett värde i fältet och onChange inträffar bara om användaren har ändrat fältets innehåll. Händelsen onBlur är att föredra om fältet är obligatoriskt.

Mer

 Adobe

Få hjälp snabbare och enklare

Ny användare?

Snabblänkar

Visa alla dina planer Hantera dina planer
Visa snabblänkar
Dölj snabblänkar

Juridiska meddelanden    |    Onlinesekretesspolicy