Забяспечце кантэкстныя паведамленні зваротнай сувязі для тыповых дзеянняў карыстальнікаў з дапамогай некалькіх даступных і гнуткіх паведамленняў абвестак.
Прыклады
Абвесткі даступныя для любой даўжыні тэксту, а таксама дадатковая кнопка адхілення. Для правільнага стылю выкарыстоўвайце адзін з васьмі неабходных кантэкстных класаў (напрыклад, .alert-success). Для ўбудаванага адхілення выкарыстоўвайце плагін абвестак jQuery .
Простая першасная абвестка - праверце!
Простае другаснае абвестка - паглядзіце!
Простая абвестка аб поспеху - праверце!
Простая абвестка аб небяспецы - праверце!
Простае папярэджанне - паглядзіце!
Простая інфармацыйная абвестка - праверце!
Простае светлавое абвестка - паглядзіце!
Простая цёмная абвестка - паглядзіце!
Перадача значэння дапаможных тэхналогій
Выкарыстанне колеру для дадання сэнсу забяспечвае толькі візуальную індыкацыю, якая не будзе перададзена карыстальнікам дапаможных тэхналогій, такіх як праграмы чытання з экрана. Пераканайцеся, што інфармацыя, пазначаная колерам, альбо відавочная з самага змесціва (напрыклад, бачнага тэксту), альбо ўключана з дапамогай альтэрнатыўных сродкаў, такіх як дадатковы тэкст, схаваны разам з .sr-onlyкласам.
Колер спасылкі
Выкарыстоўвайце .alert-linkклас утыліты, каб хутка даць адпаведныя каляровыя спасылкі ў любым абвестцы.
Простая першасная абвестка з
прыкладам спасылкі . Пстрыкніце, калі хочаце.
Простая другасная абвестка з
прыкладам спасылкі . Пстрыкніце, калі хочаце.
Простая абвестка аб поспеху з
прыкладам спасылкі . Пстрыкніце, калі хочаце.
Простая абвестка аб небяспецы з
прыкладам спасылкі . Пстрыкніце, калі хочаце.
Абвесткі могуць таксама ўтрымліваць дадатковыя элементы HTML, такія як загалоўкі, абзацы і падзельнікі.
Добра зроблена!
Ах, так, вы паспяхова прачыталі гэта важнае папярэджанне. Гэты прыклад тэксту будзе працаваць крыху даўжэй, каб вы маглі бачыць, як інтэрвал у абвестцы працуе з такім змесцівам.
Кожны раз, калі вам спатрэбіцца, не забудзьцеся выкарыстоўваць маржынальныя ўтыліты, каб трымаць рэчы прыгожымі і акуратнымі.
Звальненне
З дапамогай плагіна JavaScript для папярэджанняў можна адхіліць любое папярэджанне ў радку. Вось як:
Пераканайцеся, што вы загрузілі плагін абвестак або скампіляваны JavaScript Bootstrap.
Калі вы ствараеце наш JavaScript з зыходнага кода, патрабуеццаutil.js . Скампіляваная версія ўключае гэта.
Дадайце кнопку адхілення і .alert-dismissibleклас, які дадае дадатковую абіўку справа ад абвесткі і размяшчае .closeкнопку.
Да кнопкі адхілення дадайце data-dismiss="alert"атрыбут, які запускае функцыянальнасць JavaScript. Абавязкова выкарыстоўвайце <button>элемент з ім для правільнай працы на ўсіх прыладах.
Каб анімаваць абвесткі пры іх адхіленні, не забудзьцеся дадаць класы .fadeі ..show
Вы можаце ўбачыць гэта ў дзеянні з жывой дэманстрацыяй:
Святое гуакамоле! Вы павінны праверыць некаторыя з гэтых палёў ніжэй.
Паводзіны JavaScript
Трыгеры
Уключыць адхіленне абвесткі праз JavaScript:
Ці з дапамогай dataатрыбутаў на кнопцы ў абвестцы , як паказана вышэй:
Звярніце ўвагу, што закрыццё папярэджання выдаліць яго з DOM.
Метады
Метад
Апісанне
$().alert()
Праслухоўвае папярэджанне аб падзеях пстрычак на элементах-нашчадках, якія маюць data-dismiss="alert"атрыбут. (Не абавязкова пры выкарыстанні аўтаматычнай ініцыялізацыі data-api.)
$().alert('close')
Закрывае папярэджанне, выдаляючы яго з DOM. Калі ў элеменце прысутнічаюць класы .fadeі .show, папярэджанне згасне, перш чым ён будзе выдалены.
$().alert('dispose')
Знішчае абвестку элемента.
Падзеі
Убудова абвестак Bootstrap паказвае некалькі падзей для падключэння да функцыянальнасці абвестак.
Падзея
Апісанне
close.bs.alert
Гэта падзея запускаецца неадкладна пры closeвыкліку метаду асобніка.
closed.bs.alert
Гэта падзея запускаецца, калі абвестка была закрыта (будзе чакаць завяршэння пераходаў CSS).