Modális ablak a datalife motorban

Modális ablak a datalife motorban

Biztos vagyok benne, hogy sokan látták a modális ablakokat a webhelyeken, vagy akár használta őket. Például az oldalamon nagyon intenzíven használom őket, mert nagyon kényelmes és szép.







Ez a widget szabványos a DLE-ben.

Vizsgáljuk meg a szerkezetét, itt a legegyszerűbb szkript

FuncName # 40; # 41; $ # 40; # 40; # 41;

$ # 40; '# ModalWin' # 41; .dialog # 40; autoOpen # 58; igaz,
megmutatják # 58; „Fade”
elrejtése # 58; „Fade”
szélesség # 58; 220
magasság # 58; 450


Amint látja, normál funkcióként kapcsolódik, a neve


amely megváltoztatható, és nem szabad megismételni egy oldalon, akkor az a tárgy, amelyen az akció végrehajtásra kerül (ebben az esetben egy modális ablak jelenik meg)

Hát és más paraméterek, nevezetesen

autoOpen - alapértelmezés szerint ez az opció igazra van állítva, ami azt jelenti, hogy a párbeszédpanel automatikusan megjelenik a dialod metódus hívásakor. Ha az opció értékét hamis értékre állítja, a párbeszédpanel el lesz rejtve, és láthatóvá válik a .dialog ("nyitott").

bgiframe - az alapértelmezett érték hamis. Ha ez az opció be van állítva, hogy igaz (kívül szükség van csatlakozni bgIframe dugó) rögzített probléma IE6, válassza ki, hol az elemek tetejére helyezzük a másik eleme, függetlenül a z-index. Talán a jövőbeli verziókban a plug-in kapcsolat már nem kötelező.

gombok - ez az opció átmegy egy objektumot, amelyben megadhatja a párbeszédablakban megjelenő gombokat, és társíthatja őket a visszahívási funkciókhoz.

closeOnEscape - alapértelmezés szerint ez az opció igazra van állítva, és a párbeszédablak bezáródik, ha megnyomja az "Escape" gombot. A hamis beállítással letilthatja ezt a műveletet.

dialogClass - az ebben az opcióban megadott osztály (vagy osztályok) neve kerül alkalmazásra a párbeszédablakban a további tervezéshez.

draggable - az alapértelmezett érték igaz, ami lehetővé teszi a párbeszédpanel áthelyezését. Ha hamis, akkor a lépés nem lehetséges.

magasság - ez az opció alapértelmezés szerint automatikus, és a párbeszédpanel magasságát a tartalom határozza meg. A párbeszédpanel magasságértékét pixelben megadhatja. Például: magasság: 300. Ebben az esetben, ha a tartalom meghaladja a megadott méretet, függőleges görgetősáv jelenik meg.

hide - ez az opció lehetővé teszi a párbeszéd lezárásakor használt hatás meghatározását. Például: hide: "slide". Az alapértelmezett érték nulla, azaz Nincsenek hatások.







maxHeight - a maximális magasság, amelyre a dialógus mérete módosítható, képpontban.

maxWidth - a maximális szélesség, amelyre a dialógus mérete módosítható, képpontban.

minHeight - a minimális magasság, amelyre a dialógus mérete megváltoztatható, képpontban.

minWidth - a legkisebb szélesség, amelyre a párbeszédablak mérete módosítható, képpontban.

modal - ha ez a beállítás igazra van állítva, akkor a dialógus modális lesz. Ie A weboldalon lévő egyéb elemek blokkolva lesznek, és a felhasználó nem lesz képes kapcsolatba lépni velük. Ezt úgy érhetjük el, ha egy további réteget hozunk létre a párbeszédablak alatt, de a weboldal többi elemének felett.

pozíció - ennek az értéknek a értéke lehet egy string vagy tömb, amely meghatározza a párbeszédpanel kezdeti helyzetét. Lehetséges értékek: 'center', 'left', 'right', 'top', 'bottom'. Egy másik lehetőség ugyanazok az értékek használata a tömbben. Például, a jobb felső sarokban lévő párbeszédpanel [jobb, felső,].

átméretezhető - az alapértelmezés igaz, amely lehetővé teszi a párbeszédpanel átméretezését. Ha hamis, akkor az átméretezés lehetetlenné válik.

show - ebben az opcióban megadhatja a párbeszédablak megnyitásakor használt effektust. Például: mutasd: "dia". Az alapértelmezett érték nulla, azaz Nincsenek hatások.

stack - alapértelmezés szerint ez az opció igazra van állítva, ami lehetővé teszi az ablakot (amikor ugyanazon a weboldalon több párbeszédpanel is van), amely a többi ablak tetején jelenik meg a fókusz. Ha ezt az opciót false értékre állítja be, a kiválasztott ablakban ezt a viselkedést törli.

cím - az opció értéke lehet egy karakterlánc, amellyel újra definiálhatja a HTML-jelölésben megadott ablak címét.

szélesség - a dialógus szélessége, képpontban. Az alapértelmezett érték 300.

A zIndex a párbeszédablak z-index értéke. Az alapértelmezett érték 1000.

Igen, de ez nem a vég, még mindig ezt kell tennünk, hogy ez a szkript aktiválódjon és megmondjuk neki, hogy mi jelenjen meg (felbukkan).
Ez a gomb fog kinézni, ha rákattint a script aktiválására



Ez a legfontosabb dolog # 111; nclick = "FuncName ()"
Ez azt jelenti, hogy amikor megnyomja a gombot, megnyílik egy modális ablak. Ó, nem adtam meg a pop-up ablak kódját, a rendellenességet


Nos, ezt kaptuk, általában:

FuncName # 40; # 41; $ # 40; # 40; # 41;

$ # 40; '# ModalWin' # 41; .dialog # 40; autoOpen # 58; igaz,
megmutatják # 58; „Fade”
elrejtése # 58; „Fade”
szélesség # 58; 220
magasság # 58; 450




Ha azt szeretné, hogy továbbra is vannak olyan gombok, mint a "Bezárás". "Ok" stb. maga a forgatókönyv után (esetünkben a magasság: 450) írjuk:

"Alkalmazás" # 58; a # 40; # 41; <
alert # 40; "Nyomja meg az Alkalmaz gombot" # 41 ;;
>
"Bezár" # 58; a # 40; # 41; $ # 40; ez a # 41; .dialog # 40; "close" # 41 ;;
>
>


Ez azt jelenti, hogy egy funkciót helyezhet el a modális ablakban, például ha megnyomja az "Alkalmaz" gombot, megjelenik egy figyelmeztetés, amely "Nyomja meg az Alkalmazás gombot" és hasonlók.
Egyszóval a lehetőségeidet csak a j # 097; vascript ismerete korlátozza. Remélem, legalább megértett valamit ebből a leckéből





Kapcsolódó cikkek