Hvordan lage en Div Pop-up

Å ha en div eller del av koden vises i en pop-up boks er nyttig i en rekke sammenhenger. Det kan være lurt å varselet brukeren av noen relevant informasjon på en rask og direkte måte. Ved hjelp av en liten bit av Javascript, kan du lage en pop-up boks for en del av innholdet.

Bruksanvisning

1 Åpne IDE (Integrated Development Environment) av ditt valg.

2 Finn koden du vil skal vises i en pop-up boks, samt hva du ønsker å utløse pop-up, slik som å klikke på en knapp.

3 Formater koden i henhold til følgende syntaks:

<Script type = "text / javascript">

funksjon show_alert ()

{

alert ( "Skriv inn alternativ tekst her");

}

</ Script>

Lag en knapp for å utløse alarmen:

<Input type = "button" onclick = "show_alert ()" value = "Show varselboks" />

4 Lagre endringene i koden din, og sjekk at den fungerer som den skal.

5 Plasser innholdet i en div ved hjelp av denne modifiserte syntaks etter å forstå hvordan pop-up-funksjonalitet fungerer med foregående syntaksen. Du må bruke ".innerHTML" å trekke i HTML-innholdet i div. Sørg også for at div har en unik id:

<Div id = "test">

Dette er en test.

</ Div>

syntax:

funksjon show_alert ()

{

alert (test.innerHTML);

}

I varslingsfunksjonen, er "test" det første ordet inkludert som det er navnet på div, og ".innerHTML" brukes til å ta innholdet i det div. Bruk navnet på div id for koden din.