Tento článok je zrkadlovým článkom o strojovom preklade, kliknite sem pre prechod na pôvodný článok.

Pohľad: 20094|Odpoveď: 2

[HTML/HTML5] Veľmi pekné upozornenie SweetAlert

[Kopírovať odkaz]
Zverejnené 24. 12. 2015 12:00:48 | | | |





Sweet Alert je krásny efekt pripomínania, ktorý nahrádza tradičný Javascrip{filter}t Alert. SweetAlert automaticky centruje a zarovnáva sa do stredu stránky, takže vyzerá skvele, či už používate stolný počítač, telefón alebo tablet. Okrem toho je k dispozícii široká škála možností prispôsobenej konfigurácie pre flexibilné ovládanie.

Ako používať:

Predstavujeme:

<scrip{filter}t src="dist/sweetalert.min.js"></scrip{filter}t> <link rel="stylesheet" type="text/css" href="dist/sweetalert.css">
Potom jednoduchý príklad:

swal({ title: "Error!", text: "Tu je moja chybová správa!", typ: "error", confirmButtonText: "Cool" });
Priložený súborový balík: sweetalert-master.zip (650.13 KB, Počet stiahnutí: 9, 售价: 2 粒MB)

Argumentácia
Predvolená hodnota

Descrip{filter}tion
Názovnull (povinné)Názov modálu. Môže byť buď pridaný k objektu pod kľúčom "title" alebo odovzdaný ako prvý parameter funkcie.
TextnulaA descrip{filter}tion for the modal. Môže byť buď pridaný k objektu pod kľúčom "text", alebo odovzdaný ako druhý parameter funkcie.
typnulaTyp modálu. SweetAlert obsahuje 4 zabudované typy, ktoré zobrazia príslušnú animáciu ikony: "Upozornenie", "Chyba", "Úspech" a "info". Môžete to tiež nastaviť ako "vstup" na získanie promptného modálu. Môže byť buď vložený do objektu pod kľúčom "typ" alebo odovzdaný ako tretí parameter funkcie.
allowEscapeKeytrueAk je nastavené natrue, používateľ môže modál zrušiť stlačením klávesu Escape.
customClassnulaVlastná CSS trieda pre tento modál. Môže byť pridaná do objektu pod kľúčom "customClass".
allowOutsideClickfalseAk je nastavené natrue, používateľ môže modál zrušiť kliknutím mimo neho.
showCancelButtonfalseAk je nastavené natrue, zobrazí sa tlačidlo "Zrušiť", na ktoré môže používateľ kliknúť na zrušenie modálu.
showPotvrďovaťTlačidlotrueAk je nastavené nafalse, tlačidlo "OK/Potvrdiť" bude skryté. Uistite sa, že ste nastavili časovač alebo allowOutsideClick na true, keď ho používate, aby ste používateľa neotravovali.
confirmButtonText"OK"Použite to na zmenu textu na tlačidle "Potvrdiť". Ak je tlačidlo showCancelButton nastavené ako true, tlačidlo potvrdiť automaticky zobrazí "Potvrdiť" namiesto "OK".
confirmButtonColor"#AEDEF4"Použite to na zmenu farby pozadia tlačidla "Potvrdiť" (musí to byť hodnota HEX).
cancelButtonText"Zrušiť"Použite to na zmenu textu na tlačidle "Zrušiť".
closeOnConfirmtrueNastavené nafalseak chcete, aby modál zostal otvorený aj keď používateľ stlačí tlačidlo "Potvrdiť". To je obzvlášť užitočné, ak je funkciou pripojenou k tlačidlu "Potvrdiť" ďalší SweetAlert.
closeOnCanceltrueRovnako ako closeOnConfirm, ale pre tlačidlo zrušiť.
imageUrlnulaPridajte prispôsobenú ikonu pre modál. Mal by obsahovať reťazec s cestou k obrázku.
imageSize"80x80"Ak je nastavený imageUrl, môžete nastaviť imageSize tak, aby popisoval, akú veľkú chcete mať ikonu v px. Preneste reťazec s dvoma hodnotami oddelenými "x". Prvá hodnota je šírka, druhá je výška.
ČasovačnulaAutomatický časovač zatvárania modálu. Nastavené na ms (milisekundy).
htmlfalseAk je nastavená na true, neunikne parametrom názvu a textu. (Nastavte na falošné, ak sa obávate XSS útokov.)
AnimáciatrueAk je nastavené nafalse, animácia modálu bude deaktivovaná. Možné (reťazcové) hodnoty :pop(predvolené, keď je animácia nastavená na true),Sklz zhora, Sklz odspodu
vstupný typ"text"Zmeňte typ vstupného poľa pri použitítype: "input"(to môže byť užitočné, ak chcete, aby používatelia napríklad zadávali svoje heslo).
inputPlaceholdernulaPri použití typu vstupu môžete nastaviť zástupný symbol, ktorý pomôže používateľovi.
inputValuenulaZadajte predvolenú textovú hodnotu, ktorú chcete, aby sa pri používaní zobrazovala vaša vstupná hodnotatype: "input"
showLoaderOnConfirmfalseNastavené natrueNa deaktiváciu tlačidiel a ukázanie, že sa niečo načítava.





Predchádzajúci:HTTPS Tie veci (1) HTTPS princíp (Reprint)
Budúci:ASPX vs. MVC stránka captcha
 Prenajímateľ| Zverejnené 25. 2. 2017 18:36:23 |
Zverejnené 8. 12. 2017 15:20:55 |
Layuiho pop frame je tiež príjemný na používanie
Vyhlásenie:
Všetok softvér, programovacie materiály alebo články publikované spoločnosťou Code Farmer Network slúžia len na vzdelávacie a výskumné účely; Vyššie uvedený obsah nesmie byť použitý na komerčné alebo nezákonné účely, inak nesú všetky následky používateľmi. Informácie na tejto stránke pochádzajú z internetu a spory o autorské práva s touto stránkou nesúvisia. Musíte úplne vymazať vyššie uvedený obsah zo svojho počítača do 24 hodín od stiahnutia. Ak sa vám program páči, podporte originálny softvér, zakúpte si registráciu a získajte lepšie originálne služby. Ak dôjde k akémukoľvek porušeniu, kontaktujte nás prosím e-mailom.

Mail To:help@itsvse.com