JavaScript
Väck Bootstraps komponenter till liv med över ett dussin anpassade jQuery-plugins. Inkludera enkelt alla, eller en efter en.
Väck Bootstraps komponenter till liv med över ett dussin anpassade jQuery-plugins. Inkludera enkelt alla, eller en efter en.
Plugins kan inkluderas individuellt (med Bootstraps individuella *.js
filer), eller alla på en gång (med bootstrap.js
eller den minifierade bootstrap.min.js
).
Både bootstrap.js
och bootstrap.min.js
innehåller alla plugins i en enda fil. Inkludera endast en.
Vissa plugins och CSS-komponenter är beroende av andra plugins. Om du inkluderar insticksprogram individuellt, se till att kontrollera dessa beroenden i dokumenten. Observera också att alla plugins är beroende av jQuery (det betyder att jQuery måste inkluderas före plugin-filerna). Konsultera vårbower.json
för att se vilka versioner av jQuery som stöds.
Du kan använda alla Bootstrap-plugins enbart genom markup-API:et utan att skriva en enda rad JavaScript. Detta är Bootstraps förstklassiga API och bör vara ditt första övervägande när du använder ett plugin.
Som sagt, i vissa situationer kan det vara önskvärt att stänga av den här funktionen. Därför tillhandahåller vi också möjligheten att inaktivera dataattributet API genom att avbinda alla händelser i dokumentet med namnintervall data-api
. Det här ser ut så här:
Alternativt, för att rikta in sig på ett specifikt plugin, inkludera bara pluginens namn som ett namnområde tillsammans med data-api-namnområdet så här:
Använd inte dataattribut från flera plugins på samma element. Till exempel kan en knapp inte både ha ett verktygstips och växla en modal. För att åstadkomma detta, använd ett omslagselement.
Vi tror också att du bör kunna använda alla Bootstrap-plugins enbart genom JavaScript API. Alla offentliga API:er är enkla, kedjabara metoder och returnerar den samling som åtgärdats.
Alla metoder bör acceptera ett valfritt alternativobjekt, en sträng som riktar sig mot en viss metod, eller ingenting (som initierar en plugin med standardbeteende):
Varje plugin exponerar också sin råkonstruktör på en Constructor
egenskap: $.fn.popover.Constructor
. Om du vill skaffa en viss plugin-instans, hämta den direkt från ett element: $('[rel="popover"]').data('popover')
.
Du kan ändra standardinställningarna för en plugin genom att ändra pluginens Constructor.DEFAULTS
objekt:
Ibland är det nödvändigt att använda Bootstrap-plugins med andra UI-ramverk. Under dessa omständigheter kan namnutrymmeskollisioner ibland inträffa. Om detta händer kan du anropa .noConflict
plugin-programmet du vill återställa värdet på.
Bootstrap tillhandahåller anpassade händelser för de flesta plugins unika åtgärder. Generellt kommer dessa i en infinitiv och participform - där infinitiv (ex. show
) utlöses i början av en händelse, och dess participform (ex. shown
) utlöses vid fullbordandet av en handling.
Från och med 3.0.0 är alla Bootstrap-händelser med namn.
Alla infinitiva händelser ger preventDefault
funktionalitet. Detta ger möjlighet att stoppa utförandet av en åtgärd innan den startar.
Versionen av var och en av Bootstraps jQuery-plugin-program kan nås via VERSION
egendomen hos plugin-konstruktören. Till exempel för verktygstipsplugin:
Bootstraps plugins faller inte tillbaka särskilt graciöst när JavaScript är inaktiverat. Om du bryr dig om användarupplevelsen i det här fallet, använd <noscript>
för att förklara situationen (och hur du återaktiverar JavaScript) för dina användare och/eller lägg till dina egna anpassade reservalternativ.
Bootstrap stöder inte officiellt JavaScript-bibliotek från tredje part som Prototype eller jQuery UI. Trots .noConflict
och namnavgränsade händelser kan det finnas kompatibilitetsproblem som du måste åtgärda på egen hand.
För enkla övergångseffekter, inkludera transition.js
en gång tillsammans med de andra JS-filerna. Om du använder det kompilerade (eller minifierade) bootstrap.js
behöver du inte inkludera detta – det finns redan där.
Transition.js är en grundläggande hjälpare för transitionEnd
evenemang såväl som en CSS-övergångsemulator. Det används av andra plugins för att söka efter CSS-övergångsstöd och för att fånga hängande övergångar.
Övergångar kan inaktiveras globalt med hjälp av följande JavaScript-kodavsnitt, som måste komma efter att transition.js
(eller bootstrap.js
eller bootstrap.min.js
, i förekommande fall) har laddats:
Modalerna är strömlinjeformade men flexibla dialogrutiner med minsta möjliga funktionalitet och smarta standardinställningar.
Se till att inte öppna en modal medan en annan fortfarande är synlig. Att visa mer än en modal åt gången kräver anpassad kod.
Försök alltid att placera en modals HTML-kod på en översta nivå i ditt dokument för att undvika att andra komponenter påverkar modalens utseende och/eller funktionalitet.
Det finns några varningar när det gäller att använda modaler på mobila enheter. Se våra webbläsarsupportdokument för detaljer.
På grund av hur HTML5 definierar sin semantik har autofocus
HTML-attributet ingen effekt i Bootstrap-modaler. För att uppnå samma effekt, använd lite anpassat JavaScript:
En renderad modal med sidhuvud, brödtext och uppsättning åtgärder i sidfoten.
Växla en modal via JavaScript genom att klicka på knappen nedan. Den kommer att glida ned och tona in från toppen av sidan.
Var noga med att lägga till role="dialog"
och aria-labelledby="..."
, med hänvisning till den modala titeln, till .modal
och role="document"
till sig .modal-dialog
själv.
Dessutom kan du ge en beskrivning av din modala dialogruta med aria-describedby
på .modal
.
Att bädda in YouTube-videor i modals kräver ytterligare JavaScript som inte finns i Bootstrap för att automatiskt stoppa uppspelningen och mer. Se detta användbara Stack Overflow-inlägg för mer information.
Modalerna har två valfria storlekar, tillgängliga via modifieringsklasser för att placeras på en .modal-dialog
.
För modaler som helt enkelt visas istället för att tona in för att visa, ta bort .fade
klassen från din modala uppmärkning.
För att dra fördel av Bootstrap-rutnätssystemet inom en modal, kapslar du bara .row
s inom .modal-body
och använder sedan de normala rutsystemklasserna.
Har du ett gäng knappar som alla utlöser samma modal, bara med lite olika innehåll? Använd event.relatedTarget
och HTML- data-*
attribut (eventuellt via jQuery ) för att variera innehållet i modalen beroende på vilken knapp som klickades på. Se dokumentationen för Modal Events för detaljer om relatedTarget
,
Modal plugin växlar ditt dolda innehåll på begäran, via dataattribut eller JavaScript. Det lägger också .modal-open
till <body>
att åsidosätta standardrullningsbeteendet och genererar ett .modal-backdrop
för att tillhandahålla ett klickområde för att avvisa visade modaler när du klickar utanför modalen.
Aktivera en modal utan att skriva JavaScript. Ställ in data-toggle="modal"
på ett kontrollelement, som en knapp, tillsammans med en data-target="#foo"
eller href="#foo"
för att rikta in en specifik modal att växla.
Anropa en modal med id myModal
med en enda rad JavaScript:
Alternativ kan skickas via dataattribut eller JavaScript. För dataattribut, lägg till alternativnamnet till data-
, som i data-backdrop=""
.
namn | typ | standard | beskrivning |
---|---|---|---|
bakgrund | boolesk eller strängen'static' |
Sann | Inkluderar ett modal-bakgrundselement. Alternativt, ange static för en bakgrund som inte stänger modalen vid klick. |
tangentbord | booleskt | Sann | Stänger modalen när escape-tangenten trycks ned |
show | booleskt | Sann | Visar modalen när den initieras. |
avlägsen | väg | falsk | Detta alternativ är utfasat sedan v3.3.0 och har tagits bort i v4. Vi rekommenderar istället att använda mallar på klientsidan eller ett databindningsramverk, eller att själv anropa jQuery.load . Om en fjärr-URL tillhandahålls kommer innehållet att laddas en gång via jQuerys |
.modal(options)
Aktiverar ditt innehåll som en modal. Accepterar ett valfritt alternativ object
.
.modal('toggle')
Växlar manuellt en modal. Återgår till den som ringer innan modalen faktiskt har visats eller dolt (dvs innan händelsen shown.bs.modal
eller hidden.bs.modal
inträffar).
.modal('show')
Öppnar en modal manuellt. Återgår till den som ringer innan modalen faktiskt har visats (dvs innan shown.bs.modal
händelsen inträffar).
.modal('hide')
Döljer en modal manuellt. Återgår till den som ringer innan modalen faktiskt har dolts (dvs innan hidden.bs.modal
händelsen inträffar).
.modal('handleUpdate')
Justerar om modalens positionering för att motverka en rullningslist i fall en skulle dyka upp, vilket skulle få modalen att hoppa till vänster.
Behövs endast när höjden på modalen ändras medan den är öppen.
Bootstraps modalklass avslöjar några händelser för att koppla in modal funktionalitet.
Alla modala händelser avfyras mot själva modalen (dvs. på <div class="modal">
).
Event typ | Beskrivning |
---|---|
show.bs.modal | Denna händelse aktiveras omedelbart när show instansmetoden anropas. Om det orsakas av ett klick är det klickade elementet tillgängligt som relatedTarget egenskapen för händelsen. |
visad.bs.modal | Denna händelse utlöses när modalen har gjorts synlig för användaren (väntar på att CSS-övergångar ska slutföras). Om det orsakas av ett klick är det klickade elementet tillgängligt som relatedTarget egenskapen för händelsen. |
hide.bs.modal | Denna händelse aktiveras omedelbart när hide instansmetoden har anropats. |
hidden.bs.modal | Denna händelse utlöses när modalen har döljts för användaren (väntar på att CSS-övergångar ska slutföras). |
laddad.bs.modal | Den här händelsen aktiveras när modalen har laddat innehåll med remote alternativet. |
Lägg till rullgardinsmenyer till nästan vad som helst med detta enkla plugin, inklusive navigeringsfältet, flikar och piller.
Via dataattribut eller JavaScript växlar rullgardinspluginen dolt innehåll (rullgardinsmenyer) genom att växla .open
klassen på det överordnade listobjektet.
På mobila enheter lägger du till en rullgardinsmeny .dropdown-backdrop
som ett tryckområde för att stänga rullgardinsmenyer när du trycker utanför menyn, ett krav för korrekt iOS-stöd. Det betyder att byte från en öppen rullgardinsmeny till en annan rullgardinsmeny kräver ett extra tryck på mobilen.
Obs: data-toggle="dropdown"
Attributet används för att stänga rullgardinsmenyer på applikationsnivå, så det är en bra idé att alltid använda det.
Lägg data-toggle="dropdown"
till en länk eller knapp för att växla en rullgardinsmeny.
För att hålla webbadresser intakta med länkknappar, använd data-target
attributet istället för href="#"
.
Ring rullgardinsmenyn via JavaScript:
data-toggle="dropdown"
fortfarande krävsOavsett om du anropar din dropdown via JavaScript eller istället använder data-api, data-toggle="dropdown"
måste alltid finnas på dropdownens triggerelement.
Ingen
$().dropdown('toggle')
Växlar rullgardinsmenyn för ett givet navigeringsfält eller navigering med flikar.
Alla rullgardinshändelser aktiveras på .dropdown-menu
's överordnade element.
Alla rullgardinshändelser har en relatedTarget
egenskap vars värde är det växlande ankarelementet.
Event typ | Beskrivning |
---|---|
visa.bs.rullgardinsmeny | Den här händelsen aktiveras omedelbart när metoden show-instans anropas. |
visas.bs.rullgardinsmenyn | Den här händelsen aktiveras när rullgardinsmenyn har gjorts synlig för användaren (väntar på att CSS-övergångar ska slutföras). |
dölj.bs.rullgardinsmenyn | Denna händelse utlöses omedelbart när metoden hide instans har anropats. |
gömd.bs.rullgardinsmeny | Den här händelsen aktiveras när rullgardinsmenyn har döljts för användaren (väntar på att CSS-övergångar ska slutföras). |
ScrollSpy-pluginen är till för att automatiskt uppdatera navigeringsmål baserat på rullningsposition. Bläddra i området under navigeringsfältet och se hur den aktiva klassen ändras. Underposterna i rullgardinsmenyn kommer också att markeras.
Annonsleggings keytar, brunch-id art party dolor labore. Pitchfork yr enim lo-fi innan de sålde slut qui. Tumblr cykelrättigheter från jord till bord oavsett. Anim keffiyeh carles kofta. Velit seitan mcsweeney's photo booth 3 wolf moon irure. Cosby sweater lomo jeans shorts, williamsburg hoodie minim qui du förmodligen inte har hört talas om dem et cardigan trust fund culpa biodiesel wes anderson aesthetic. Nihil tatuerade accusamus, cred ironi biodiesel keffiyeh hantverkare ullamco consequat.
Veniam marfa mustasch skateboard, adipisicing fugiat velit höggaffelskägg. Freegan beard aliqua cupidatat mcsweeney's vero. Cupidatat fyra loko nisi, ea helvetica nulla carles. Tatuerad cosbytröja food truck, mcsweeney's quis non freegan vinyl. Lo-fi wes anderson +1 sartorial. Carles icke-estetisk övning quis gentrify. Brooklyn adipisicing hantverksöl vice keytar deserunt.
Occaecat commodo aliqua delectus. Fap craft beer deserunt skateboard ea. Lomo bicycle rights adipisicing banh mi, velit ea sunt next level locavore single-origin coffee in magna veniam. High life id vinyl, echo park consequat quis aliquip banh mi pitchfork. Vero VHS är adipisicing. Consectetur nisi DIY minim messenger bag. Cred ex in, hållbar delectus consectetur fanny pack iphone.
In incididunt echo park, officia deserunt mcsweeney's proident master cleanse thundercats sapiente veniam. Excepteur VHS elit, proident shoreditch +1 biodiesel laborum craft beer. Single-origin coffee wayfarers irure four loko, cupidatat terry richardson master cleanse. Assumenda you probably haven't heard of them art party fanny pack, tattooed nulla cardigan tempor ad. Proident wolf nesciunt sartorial keffiyeh eu banh mi sustainable. Elit wolf voluptate, lo-fi ea portland before they sold out four loko. Locavore enim nostrud mlkshk brooklyn nesciunt.
Ad leggings keytar, brunch id art party dolor labore. Pitchfork yr enim lo-fi before they sold out qui. Tumblr farm-to-table bicycle rights whatever. Anim keffiyeh carles cardigan. Velit seitan mcsweeney's photo booth 3 wolf moon irure. Cosby sweater lomo jean shorts, williamsburg hoodie minim qui you probably haven't heard of them et cardigan trust fund culpa biodiesel wes anderson aesthetic. Nihil tattooed accusamus, cred irony biodiesel keffiyeh artisan ullamco consequat.
Keytar twee blogg, culpa messenger bag marfa whatever delectus food truck. Sapiente synth id assumenda. Locavore sed helvetica cliche ironi, thundercats du förmodligen inte har hört talas om dem consequat hoodie glutenfri lo-fi fap aliquip. Labore elit placeat innan de sålde slut, terry richardson proident brunch nesciunt quis cosby sweater pariatur keffiyeh ut helvetica artisan. Cardigan hantverksöl seitan färdiggjord velit. VHS chambray laboris tempor veniam. Anim mollit minim commodo ullamco thundercats.
Navbar-länkar måste ha lösbara id-mål. Till exempel måste ett <a href="#home">home</a>
måste motsvara något i DOM som <div id="home"></div>
.
:visible
ignorerasMålelement som inte är :visible
enligt jQuery kommer att ignoreras och deras motsvarande nav-objekt kommer aldrig att markeras.
Oavsett implementeringsmetod kräver scrollspy användning av position: relative;
elementet du spionerar på. I de flesta fall är detta <body>
. När du scrollspionerar på andra element än <body>
, se till att ha en height
uppsättning och overflow-y: scroll;
tillämpad.
För att enkelt lägga till scrollspy-beteende till din toppfältsnavigering, lägg data-spy="scroll"
till elementet du vill spionera på (vanligtvis skulle detta vara <body>
). Lägg sedan till data-target
attributet med ID eller klass för det överordnade elementet för någon Bootstrap- .nav
komponent.
Efter att ha lagt position: relative;
till din CSS, ring scrollspy via JavaScript:
.scrollspy('refresh')
När du använder scrollspy i kombination med att lägga till eller ta bort element från DOM, måste du anropa uppdateringsmetoden så här:
Alternativ kan skickas via dataattribut eller JavaScript. För dataattribut, lägg till alternativnamnet till data-
, som i data-offset=""
.
namn | typ | standard | beskrivning |
---|---|---|---|
offset | siffra | 10 | Pixlar att förskjuta från toppen vid beräkning av rullningsposition. |
Event typ | Beskrivning |
---|---|
activate.bs.scrollspy | Denna händelse utlöses när ett nytt objekt aktiveras av scrollspy. |
Lägg till snabb, dynamisk flikfunktion för övergång genom paneler med lokalt innehåll, även via rullgardinsmenyer. Kapslade flikar stöds inte.
Raw denim du förmodligen inte har hört talas om dem jeans shorts Austin. Nesciunt tofu stumptown aliqua, retro synth master cleanse. Mustasch cliche tempor, williamsburg carles vegan helvetica. Reprehenderit butcher retro keffiyeh dreamcatcher synth. Cosby tröja eu banh mi, qui irure terry richardson ex squid. Aliquip placeat salvia cillum iphone. Seitan aliquip quis cardigan amerikanska kläder, slaktare voluptate nisi qui.
Food truck fixie locavore, accusamus mcsweeney's marfa nulla single-origin coffee squid. Exercitation +1 labore velit, blog sartorial PBR leggings next level wes anderson artisan four loko farm-to-table craft beer twee. Qui photo booth letterpress, commodo enim craft beer mlkshk aliquip jean shorts ullamco ad vinyl cillum PBR. Homo nostrud organic, assumenda labore aesthetic magna delectus mollit. Keytar helvetica VHS salvia yr, vero magna velit sapiente labore stumptown. Vegan fanny pack odio cillum wes anderson 8-bit, sustainable jean shorts beard ut DIY ethical culpa terry richardson biodiesel. Art party scenester stumptown, tumblr butcher vero sint qui sapiente accusamus tattooed echo park.
Etsy mixtape wayfarers, ethical wes anderson tofu before they sold out mcsweeney's organic lomo retro fanny pack lo-fi farm-to-table readymade. Messenger bag gentrify pitchfork tattooed craft beer, iphone skateboard locavore carles etsy salvia banksy hoodie helvetica. DIY synth PBR banksy irony. Leggings gentrify squid 8-bit cred pitchfork. Williamsburg banh mi whatever gluten-free, carles pitchfork biodiesel fixie etsy retro mlkshk vice blog. Scenester cred you probably haven't heard of them, vinyl craft beer blog stumptown. Pitchfork sustainable tofu synth chambray yr.
Trust fund seitan letterpress, keytar raw denim keffiyeh etsy art party before they sold out master cleanse gluten-free squid scenester freegan cosby sweater. Fanny pack portland seitan DIY, art party locavore wolf cliche high life echo park Austin. Cred vinyl keffiyeh DIY salvia PBR, banh mi before they sold out farm-to-table VHS viral locavore cosby sweater. Lomo wolf viral, mustache readymade thundercats keffiyeh craft beer marfa ethical. Wolf salvia freegan, sartorial keffiyeh echo park vegan.
Denna plugin utökar navigeringskomponenten med flikar för att lägga till flikbara områden.
Aktivera flikar via JavaScript (varje flik måste aktiveras individuellt):
Du kan aktivera enskilda flikar på flera sätt:
Du kan aktivera en navigering med flikar eller piller utan att skriva något JavaScript genom att helt enkelt ange data-toggle="tab"
eller data-toggle="pill"
på ett element. Om du lägger till nav
klasserna nav-tabs
och på fliken ul
tillämpas Bootstrap- flikens stil , medan om du lägger till nav
klasserna nav-pills
och tillämpas pillerstilen .
För att få flikar att tona in, lägg .fade
till varje .tab-pane
. Den första flikrutan måste också .in
göra det ursprungliga innehållet synligt.
$().tab
Aktiverar ett flikelement och innehållsbehållare. Tab ska ha antingen en data-target
eller en href
inriktning på en containernod i DOM. I exemplen ovan är flikarna <a>
s med data-toggle="tab"
attribut.
.tab('show')
Väljer den givna fliken och visar dess associerade innehåll. Alla andra flikar som tidigare valts avmarkeras och dess associerade innehåll döljs. Återgår till den som ringer innan flikrutan faktiskt har visats (dvs innan shown.bs.tab
händelsen inträffar).
När en ny flik visas aktiveras händelserna i följande ordning:
hide.bs.tab
(på den aktuella aktiva fliken)show.bs.tab
(på fliken som ska visas)hidden.bs.tab
(på föregående aktiva flik, samma som för hide.bs.tab
händelsen)shown.bs.tab
(på den nyligen aktiva fliken som just visades, samma som för show.bs.tab
evenemanget)Om ingen flik redan var aktiv kommer händelserna hide.bs.tab
och hidden.bs.tab
inte att aktiveras.
Event typ | Beskrivning |
---|---|
visa.bs.tab | Den här händelsen aktiveras vid flikvisning, men innan den nya fliken har visats. Använd event.target och event.relatedTarget för att rikta in den aktiva fliken respektive den föregående aktiva fliken (om tillgänglig). |
visad.bs.tab | Den här händelsen aktiveras vid flikvisning efter att en flik har visats. Använd event.target och event.relatedTarget för att rikta in den aktiva fliken respektive den föregående aktiva fliken (om tillgänglig). |
hide.bs.tab | Den här händelsen aktiveras när en ny flik ska visas (och därmed den tidigare aktiva fliken ska döljas). Använd event.target och event.relatedTarget för att rikta in den aktuella aktiva fliken respektive den nya snart-aktiva fliken. |
hidden.bs.tab | Den här händelsen aktiveras efter att en ny flik har visats (och den tidigare aktiva fliken döljs därför). Använd event.target och event.relatedTarget för att rikta in den tidigare aktiva fliken respektive den nya aktiva fliken. |
Inspirerad av det utmärkta plugin-programmet jQuery.tipsy skrivet av Jason Frame; Verktygstips är en uppdaterad version som inte förlitar sig på bilder, använder CSS3 för animationer och dataattribut för lokal titellagring.
Verktygstips med noll-längd titlar visas aldrig.
Håll muspekaren över länkarna nedan för att se verktygstips:
Tighta byxor nästa nivå keffiyeh du har förmodligen inte hört talas om dem. Photo booth skägg rå denim boktryck vegan messenger bag stumptown. Farm-to-table seitan, mcsweeney's fixie hållbara quinoa 8-bitars amerikanska kläder har en frotté richardson vinyl chambray. Beard stumptown, koftor banh mi lomo thundercats. Tofu biodiesel williamsburg marfa, fyra loko mcsweeney's cleanse vegan chambray. En riktigt ironisk hantverkare oavsett keytar , scenester farm-to-table banksy Austin twitter handtag freegan cred raw denim enkaffe viral.
Fyra alternativ är tillgängliga: topp-, höger-, botten- och vänsterjusterad.
Av prestandaskäl är verktygstips och Popover-data-apis opt-in, vilket innebär att du måste initiera dem själv .
Ett sätt att initiera alla verktygstips på en sida är att välja dem efter deras data-toggle
attribut:
Verktygstipspluginen genererar innehåll och uppmärkning på begäran och placerar som standard verktygstips efter deras utlösarelement.
Aktivera verktygstipset via JavaScript:
Den nödvändiga markeringen för ett verktygstips är bara ett data
attribut och title
på HTML-elementet vill du ha ett verktygstips. Den genererade markeringen av ett verktygstips är ganska enkel, även om den kräver en position (som standard inställd på top
av plugin).
Ibland vill du lägga till ett verktygstips till en hyperlänk som omsluter flera rader. Standardbeteendet för verktygstipsplugin är att centrera den horisontellt och vertikalt. Lägg white-space: nowrap;
till dina ankare för att undvika detta.
När du använder verktygstips på element inom ett .btn-group
eller ett .input-group
, eller på tabellrelaterade element ( <td>
, <th>
, <tr>
, <thead>
, <tbody>
, <tfoot>
), måste du ange alternativet container: 'body'
(dokumenterat nedan) för att undvika oönskade biverkningar (som att elementet växer sig bredare och/ eller tappar sina rundade hörn när verktygstipset utlöses).
För användare som navigerar med ett tangentbord, och i synnerhet användare av hjälpmedel, bör du bara lägga till verktygstips till tangentbordsfokuserbara element som länkar, formulärkontroller eller något godtyckligt element med ett tabindex="0"
attribut.
För att lägga till ett verktygstips till ett disabled
eller .disabled
element, placera elementet inuti ett <div>
och tillämpa verktygstipset på det <div>
istället.
Alternativ kan skickas via dataattribut eller JavaScript. För dataattribut, lägg till alternativnamnet till data-
, som i data-animation=""
.
namn | Typ | Standard | Beskrivning |
---|---|---|---|
animation | booleskt | Sann | Använd en CSS-tonningsövergång på verktygstipset |
behållare | sträng | falsk | falsk | Lägger till verktygstipset till ett specifikt element. Exempel: |
dröjsmål | nummer | objekt | 0 | Fördröjning av att visa och dölja verktygstipset (ms) - gäller inte manuell triggertyp Om ett nummer tillhandahålls tillämpas fördröjning på både hide/show Objektstrukturen är: |
html | booleskt | falsk | Infoga HTML i verktygstipset. Om det är falskt kommer jQuerys text metod att användas för att infoga innehåll i DOM. Använd text om du är orolig för XSS-attacker. |
placering | sträng | fungera | 'topp' | Så här placerar du verktygstipset - topp | botten | vänster | höger | bil. När en funktion används för att bestämma placeringen anropas den med verktygstipset DOM-nod som sitt första argument och det utlösande elementet DOM-nod som sin andra. Kontexten |
väljare | sträng | falsk | Om en väljare tillhandahålls kommer verktygstipsobjekt att delegeras till de angivna målen. I praktiken används detta för att tillåta verktygstips för dynamiskt HTML-innehåll. Se detta och ett informativt exempel . |
mall | sträng | '<div class="tooltip" role="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>' |
Basera HTML för att använda när du skapar verktygstipset. Verktygstipsen
Det yttersta omslagselementet ska ha |
titel | sträng | fungera | '' | Standardtitelvärde om Om en funktion ges kommer den att anropas med dess |
utlösare | sträng | "sväva fokus" | Hur verktygstips utlöses - klicka på | sväva | fokus | manuell. Du kan passera flera triggers; separera dem med ett mellanslag. manual kan inte kombineras med någon annan trigger. |
utsiktsplats | sträng | objekt | fungera | { selector: 'body', padding: 0 } | Håller verktygstipset inom gränserna för detta element. Exempel: Om en funktion ges anropas den med det utlösande elementet DOM-nod som enda argument. Kontexten |
Alternativ för individuella verktygstips kan alternativt specificeras genom användning av dataattribut, som förklarats ovan.
$().tooltip(options)
Bifogar en verktygstipshanterare till en elementsamling.
.tooltip('show')
Visar ett elements verktygstips. Återgår till den som ringer innan verktygstipset faktiskt har visats (dvs innan shown.bs.tooltip
händelsen inträffar). Detta anses vara en "manuell" triggning av verktygstipset. Verktygstips med noll-längd titlar visas aldrig.
.tooltip('hide')
Döljer ett elements verktygstips. Återgår till den som ringer innan verktygstipset faktiskt har dolts (dvs innan hidden.bs.tooltip
händelsen inträffar). Detta anses vara en "manuell" triggning av verktygstipset.
.tooltip('toggle')
Växlar ett elements verktygstips. Återgår till den som ringer innan verktygstipset faktiskt har visats eller dolt (dvs innan händelsen shown.bs.tooltip
eller hidden.bs.tooltip
inträffar). Detta anses vara en "manuell" triggning av verktygstipset.
.tooltip('destroy')
Döljer och förstör ett elements verktygstips. Verktygstips som använder delegering (som skapas med alternativet selector
) kan inte förstöras individuellt på underliggande triggerelement.
Event typ | Beskrivning |
---|---|
visa.bs.verktygstips | Denna händelse aktiveras omedelbart när show instansmetoden anropas. |
visat.bs.verktygstips | Denna händelse utlöses när verktygstipset har gjorts synligt för användaren (väntar på att CSS-övergångar ska slutföras). |
hide.bs.tooltip | Denna händelse aktiveras omedelbart när hide instansmetoden har anropats. |
dolt.bs.verktygstips | Den här händelsen utlöses när verktygstipset har döljts för användaren (väntar på att CSS-övergångar ska slutföras). |
insatt.bs.verktygstips | Denna händelse aktiveras efter show.bs.tooltip händelsen när verktygstipsmallen har lagts till i DOM. |
Lägg till små överlagringar av innehåll, som de på iPad, till valfritt element för att hysa sekundär information.
Popovers vars både titel och innehåll är noll-längd visas aldrig.
Popovers kräver att verktygstipspluginen ingår i din version av Bootstrap.
Av prestandaskäl är verktygstips och Popover-data-apis opt-in, vilket innebär att du måste initiera dem själv .
Ett sätt att initiera alla popovers på en sida är att välja dem efter deras data-toggle
attribut:
När du använder popovers på element inom ett .btn-group
eller ett .input-group
, eller på tabellrelaterade element ( <td>
, <th>
, <tr>
, <thead>
, <tbody>
, <tfoot>
), måste du ange alternativet container: 'body'
(dokumenteras nedan) för att undvika oönskade biverkningar (som att elementet växer sig bredare och/ eller förlorar sina rundade hörn när popover utlöses).
För att lägga till en popover till ett disabled
eller .disabled
element, placera elementet inuti ett <div>
och applicera popover på det <div>
istället.
Ibland vill du lägga till en popover till en hyperlänk som omsluter flera rader. Standardbeteendet för popover-pluginet är att centrera det horisontellt och vertikalt. Lägg white-space: nowrap;
till dina ankare för att undvika detta.
Fyra alternativ är tillgängliga: topp-, höger-, botten- och vänsterjusterad.
Sed posuere consectetur est at lobortis. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.
Sed posuere consectetur est at lobortis. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.
Sed posuere consectetur est at lobortis. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.
Sed posuere consectetur est at lobortis. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.
Använd focus
utlösaren för att ta bort popovers vid nästa klick som användaren gör.
För korrekt beteende över webbläsare och plattformar måste du använda <a>
taggen, inte<button>
taggen, och du måste också inkludera attributen role="button"
och .tabindex
Aktivera popovers via JavaScript:
Alternativ kan skickas via dataattribut eller JavaScript. För dataattribut, lägg till alternativnamnet till data-
, som i data-animation=""
.
namn | Typ | Standard | Beskrivning |
---|---|---|---|
animation | booleskt | Sann | Tillämpa en CSS-tonningsövergång på popover-fönstret |
behållare | sträng | falsk | falsk | Lägger till popover till ett specifikt element. Exempel: |
innehåll | sträng | fungera | '' | Standardvärde för innehåll om Om en funktion ges kommer den att anropas med dess |
dröjsmål | nummer | objekt | 0 | Fördröjning av att visa och dölja popover (ms) - gäller inte manuell triggertyp Om ett nummer tillhandahålls tillämpas fördröjning på både hide/show Objektstrukturen är: |
html | booleskt | falsk | Infoga HTML i popover-fönstret. Om det är falskt kommer jQuerys text metod att användas för att infoga innehåll i DOM. Använd text om du är orolig för XSS-attacker. |
placering | sträng | fungera | 'höger' | Så här placerar du popover - toppen | botten | vänster | höger | bil. När en funktion används för att bestämma placeringen anropas den med popover-DOM-noden som sitt första argument och det utlösande elementet DOM-noden som sin andra. Kontexten |
väljare | sträng | falsk | Om en väljare tillhandahålls kommer popover-objekt att delegeras till de angivna målen. I praktiken används detta för att dynamiskt HTML-innehåll ska kunna läggas till popovers. Se detta och ett informativt exempel . |
mall | sträng | '<div class="popover" role="tooltip"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>' |
Basera HTML att använda när du skapar popover. Popover Popover
Det yttersta omslagselementet ska ha |
titel | sträng | fungera | '' | Standardtitelvärde om Om en funktion ges kommer den att anropas med dess |
utlösare | sträng | 'klick' | Hur popover utlöses - klicka på | sväva | fokus | manuell. Du kan passera flera triggers; separera dem med ett mellanslag. manual kan inte kombineras med någon annan trigger. |
utsiktsplats | sträng | objekt | fungera | { selector: 'body', padding: 0 } | Håller popover inom gränserna för detta element. Exempel: Om en funktion ges anropas den med det utlösande elementet DOM-nod som enda argument. Kontexten |
Alternativ för individuella popovers kan alternativt specificeras genom användning av dataattribut, som förklarats ovan.
$().popover(options)
Initierar popovers för en elementsamling.
.popover('show')
Avslöjar ett elements popover. Återgår till den som ringer innan popover faktiskt har visats (dvs innan shown.bs.popover
händelsen inträffar). Detta anses vara en "manuell" utlösning av popover. Popovers vars både titel och innehåll är noll-längd visas aldrig.
.popover('hide')
Döljer ett elements popover. Återgår till den som ringer innan popover faktiskt har dolts (dvs innan hidden.bs.popover
händelsen inträffar). Detta anses vara en "manuell" utlösning av popover.
.popover('toggle')
Växlar ett elements popover. Återgår till den som ringer innan popover faktiskt har visats eller dolt (dvs innan händelsen shown.bs.popover
eller hidden.bs.popover
inträffar). Detta anses vara en "manuell" utlösning av popover.
.popover('destroy')
Döljer och förstör ett elements popover. Popovers som använder delegering (som skapas med alternativet selector
) kan inte förstöras individuellt på underliggande triggerelement.
Event typ | Beskrivning |
---|---|
show.bs.popover | Denna händelse aktiveras omedelbart när show instansmetoden anropas. |
visas.bs.popover | Den här händelsen aktiveras när popoveren har gjorts synlig för användaren (väntar på att CSS-övergångar ska slutföras). |
hide.bs.popover | Denna händelse aktiveras omedelbart när hide instansmetoden har anropats. |
hidden.bs.popover | Den här händelsen aktiveras när popover-fönstret har döljts för användaren (väntar på att CSS-övergångar ska slutföras). |
insatt.bs.popover | Denna händelse aktiveras efter show.bs.popover händelsen när popover-mallen har lagts till i DOM. |
Lägg till avvisningsfunktion i alla varningsmeddelanden med detta plugin.
När du använder en .close
knapp måste den vara det första underordnade av den .alert-dismissible
och inget textinnehåll får komma före den i markeringen.
Ändra det och det och försök igen. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum.
Lägg bara data-dismiss="alert"
till i din stängningsknapp för att automatiskt ge en varningsfunktionalitet för stängning. När du stänger en varning tas den bort från DOM.
För att dina varningar ska använda animering när de stänger, se till att de har klasserna .fade
och .in
redan tillämpade på dem.
$().alert()
Får en varning att lyssna efter klickhändelser på underordnade element som har data-dismiss="alert"
attributet. (Inte nödvändigt när du använder data-API:s automatiska initiering.)
$().alert('close')
Stänger en varning genom att ta bort den från DOM. Om klasserna .fade
och .in
finns på elementet kommer varningen att tona ut innan den tas bort.
Bootstraps varningsplugin avslöjar några händelser för att koppla in varningsfunktioner.
Event typ | Beskrivning |
---|---|
stäng.bs.varning | Denna händelse aktiveras omedelbart när close instansmetoden anropas. |
stängd.bs.varning | Den här händelsen utlöses när varningen har stängts (väntar på att CSS-övergångar ska slutföras). |
Gör mer med knappar. Kontrollera knapptillstånd eller skapa grupper av knappar för fler komponenter som verktygsfält.
Firefox kvarstår från kontrolltillstånd (inaktiverad och kontrollerad) över sidladdningar . En lösning för detta är att använda autocomplete="off"
. Se Mozilla-fel #654072 .
Lägg data-loading-text="Loading..."
till för att använda ett laddningstillstånd på en knapp.
Den här funktionen är utfasad sedan v3.3.5 och har tagits bort i v4.
För den här demonstrationens skull använder vi data-loading-text
och $().button('loading')
, men det är inte det enda tillståndet du kan använda. Se mer om detta nedan i $().button(string)
dokumentationen .
Lägg data-toggle="button"
till för att aktivera växling på en enda knapp.
.active
ocharia-pressed="true"
För förinställda knappar måste du lägga till .active
klassen och aria-pressed="true"
attributet till button
dig själv.
Lägg data-toggle="buttons"
till i en .btn-group
innehållande kryssruta eller radioingångar för att aktivera växling i deras respektive stilar.
.active
För förvalda alternativ måste du själv lägga till .active
klassen i ingången label
.
Om det markerade tillståndet för en kryssrutaknapp uppdateras utan att en click
händelse avfyras på knappen (t.ex. via <input type="reset">
eller via inställning av checked
egenskapen för ingången), måste du själv växla .active
klassen på ingången label
.
$().button('toggle')
Växlar push-tillstånd. Ger knappen intrycket att den har aktiverats.
$().button('reset')
Återställer knappstatus - byter text till originaltext. Denna metod är asynkron och återkommer innan återställningen faktiskt har slutförts.
$().button(string)
Byter text till valfritt datadefinierat textläge.
Flexibelt plugin som använder en handfull klasser för enkelt växlingsbeteende.
Collapse kräver att transitions-pluginen ingår i din version av Bootstrap.
Klicka på knapparna nedan för att visa och dölja ett annat element via klassändringar:
.collapse
döljer innehåll.collapsing
tillämpas under övergångar.collapse.in
visar innehållDu kan använda en länk med href
attributet eller en knapp med data-target
attributet. I båda fallen data-toggle="collapse"
krävs.
Utöka standardfunktionen för kollaps för att skapa ett dragspel med panelkomponenten.
Det är också möjligt att byta ut .panel-body
s med .list-group
s.
Var noga med att lägga aria-expanded
till kontrollelementet. Det här attributet definierar explicit det hopfällbara elementets nuvarande tillstånd för skärmläsare och liknande hjälpmedelstekniker. Om det hopfällbara elementet är stängt som standard bör det ha värdet aria-expanded="false"
. Om du har angett att det hopfällbara elementet ska vara öppet som standard med in
klassen, ställ in aria-expanded="true"
på kontrollen istället. Insticksprogrammet växlar automatiskt detta attribut baserat på om det hopfällbara elementet har öppnats eller stängts.
Dessutom, om ditt kontrollelement är inriktat på ett enstaka hopfällbart element – dvs data-target
attributet pekar på en id
väljare – kan du lägga till ett ytterligare aria-controls
attribut till kontrollelementet som innehåller id
det hopfällbara elementet. Moderna skärmläsare och liknande hjälpmedel använder detta attribut för att ge användarna ytterligare genvägar för att navigera direkt till själva det hopfällbara elementet.
Kollapspluginen använder några klasser för att hantera tunga lyft:
.collapse
döljer innehållet.collapse.in
visar innehållet.collapsing
läggs till när övergången startar och tas bort när den är klarDessa klasser finns i component-animations.less
.
Lägg bara till data-toggle="collapse"
och ett data-target
till elementet för att automatiskt tilldela kontroll över ett hopfällbart element. Attributet data-target
accepterar en CSS-väljare att tillämpa komprimeringen på. Se till att lägga till klassen collapse
i det hopfällbara elementet. Om du vill att den ska öppnas som standard lägger du till den extra klassen in
.
Lägg till dataattributet för att lägga till dragspelsliknande grupphantering till en hopfällbar kontroll data-parent="#selector"
. Se demon för att se detta i aktion.
Aktivera manuellt med:
Alternativ kan skickas via dataattribut eller JavaScript. För dataattribut, lägg till alternativnamnet till data-
, som i data-parent=""
.
namn | typ | standard | beskrivning |
---|---|---|---|
förälder | väljare | falsk | Om en väljare tillhandahålls kommer alla hopfällbara element under den angivna överordnade att stängas när detta hopfällbara objekt visas. (liknar traditionellt dragspelsbeteende - detta beror på panel klassen) |
växla | booleskt | Sann | Växlar det hopfällbara elementet vid anrop |
.collapse(options)
Aktiverar ditt innehåll som ett hopfällbart element. Accepterar ett valfritt alternativ object
.
.collapse('toggle')
Växlar ett hopfällbart element till att visas eller döljas. Återgår till den som ringer innan det hopfällbara elementet faktiskt har visats eller dolt (dvs innan händelsen shown.bs.collapse
eller hidden.bs.collapse
inträffar).
.collapse('show')
Visar ett hopfällbart element. Återgår till den som ringer innan det hopfällbara elementet faktiskt har visats (dvs innan shown.bs.collapse
händelsen inträffar).
.collapse('hide')
Döljer ett hopfällbart element. Återgår till den som ringer innan det hopfällbara elementet faktiskt har dolts (dvs innan hidden.bs.collapse
händelsen inträffar).
Bootstraps kollapsklass avslöjar några händelser för att koppla in kollapsfunktionalitet.
Event typ | Beskrivning |
---|---|
visa.bs.kollaps | Denna händelse aktiveras omedelbart när show instansmetoden anropas. |
visas.bs.kollaps | Den här händelsen utlöses när ett kollapselement har gjorts synligt för användaren (väntar på att CSS-övergångar ska slutföras). |
hide.bs.kollaps | Denna händelse aktiveras omedelbart när hide metoden har anropats. |
hidden.bs.kollaps | Den här händelsen utlöses när ett kollapselement har dolts för användaren (väntar på att CSS-övergångar ska slutföras). |
En bildspelskomponent för att cykla genom element, som en karusell. Kapslade karuseller stöds inte.
Karusellkomponenten är i allmänhet inte kompatibel med tillgänglighetsstandarder. Om du behöver följa efterlevnaden, överväg andra alternativ för att presentera ditt innehåll.
Bootstrap använder uteslutande CSS3 för sina animationer, men Internet Explorer 8 och 9 stöder inte de nödvändiga CSS-egenskaperna. Det finns alltså inga bildövergångsanimationer när du använder dessa webbläsare. Vi har avsiktligt beslutat att inte inkludera jQuery-baserade fallbacks för övergångarna.
Klassen .active
måste läggas till på en av bilderna. Annars kommer karusellen inte att synas.
Klasserna .glyphicon .glyphicon-chevron-left
och .glyphicon .glyphicon-chevron-right
behövs inte nödvändigtvis för kontrollerna. Bootstrap tillhandahåller .icon-prev
och .icon-next
som vanliga unicode-alternativ.
Lägg enkelt till bildtexter till dina bilder med .carousel-caption
elementet i valfri .item
. Placera nästan vilken valfri HTML som helst där så kommer den att justeras och formateras automatiskt.
Karuseller kräver användning av en id
på den yttersta behållaren (den .carousel
) för att karusellreglagen ska fungera korrekt. När du lägger till flera karuseller, eller när du byter en karusells id
, se till att uppdatera de relevanta kontrollerna.
Använd dataattribut för att enkelt kontrollera karusellens position. data-slide
accepterar nyckelorden prev
eller next
, vilket ändrar bildens position i förhållande till dess nuvarande position. Alternativt kan du använda data-slide-to
för att skicka ett obearbetat diabildsindex till karusellen data-slide-to="2"
, vilket skiftar objektglaspositionen till ett visst index som börjar med 0
.
Attributet data-ride="carousel"
används för att markera en karusell som animering med början vid sidladdning. Den kan inte användas i kombination med (redundant och onödig) explicit JavaScript-initiering av samma karusell.
Ring karusellen manuellt med:
Alternativ kan skickas via dataattribut eller JavaScript. För dataattribut, lägg till alternativnamnet till data-
, som i data-interval=""
.
namn | typ | standard | beskrivning |
---|---|---|---|
intervall | siffra | 5 000 | Hur lång tid det tar mellan att automatiskt cykla ett objekt. Om det är falskt, kommer karusellen inte att cykla automatiskt. |
paus | sträng | null | "sväva" | Om inställt på "hover" , pausar cyklingen av karusellen på mouseenter och återupptar cyklingen av karusellen på mouseleave . Om inställt på null , pausas den inte om du håller muspekaren över karusellen. |
slå in | booleskt | Sann | Om karusellen ska cykla kontinuerligt eller ha hårda stopp. |
tangentbord | booleskt | Sann | Om karusellen ska reagera på tangentbordshändelser. |
.carousel(options)
Initierar karusellen med ett valfritt alternativ object
och börjar cykla igenom föremål.
.carousel('cycle')
Cyklar genom karusellföremålen från vänster till höger.
.carousel('pause')
Stoppar karusellen från att cykla genom föremål.
.carousel(number)
Cyklar karusellen till en viss bildruta (0-baserad, liknande en array).
.carousel('prev')
Går till föregående post.
.carousel('next')
Går till nästa objekt.
Bootstraps karusellklass avslöjar två händelser för att koppla in karusellfunktionalitet.
Båda händelserna har följande ytterligare egenskaper:
direction
: Den riktning i vilken karusellen glider (antingen "left"
eller "right"
).relatedTarget
: DOM-elementet som skjuts på plats som det aktiva objektet.Alla karusellhändelser avfyras mot själva karusellen (dvs. vid <div class="carousel">
).
Event typ | Beskrivning |
---|---|
slide.bs.carousel | Denna händelse aktiveras omedelbart när slide instansmetoden anropas. |
slid.bs.karusell | Denna händelse aktiveras när karusellen har slutfört sin bildövergång. |
Affix-pluginet växlar position: fixed;
på och av och emulerar effekten som hittas med position: sticky;
. Undernavigeringen till höger är en livedemo av affix-plugin.
Använd affix-plugin via dataattribut eller manuellt med ditt eget JavaScript. I båda situationerna måste du tillhandahålla CSS för placering och bredd på ditt anbringade innehåll.
Obs: Använd inte affix-plugin på ett element som finns i ett relativt placerat element, till exempel en dragen eller tryckt kolumn, på grund av en Safari-renderingsbugg .
Affix-pluginen växlar mellan tre klasser, som var och en representerar ett visst tillstånd: .affix
, .affix-top
, och .affix-bottom
. Du måste tillhandahålla stilarna, med undantag för position: fixed;
på .affix
, för dessa klasser själv (oberoende av detta plugin) för att hantera de faktiska positionerna.
Så här fungerar affix-pluginet:
.affix-top
för att indikera att elementet är i sin översta position. Vid denna tidpunkt krävs ingen CSS-positionering..affix
som ersätter.affix-top
och ställer in position: fixed;
(tillhandahålls av Bootstraps CSS)..affix
med .affix-bottom
. Eftersom förskjutningar är valfria, måste du ställa in en lämplig CSS. I det här fallet, lägg tillposition: absolute;
vid behov. Insticksprogrammet använder dataattributet eller JavaScript-alternativet för att bestämma var elementet ska placeras därifrån.Följ stegen ovan för att ställa in din CSS för något av användningsalternativen nedan.
För att enkelt lägga till affixbeteende till ett element, lägg bara data-spy="affix"
till elementet du vill spionera på. Använd förskjutningar för att definiera när du ska växla mellan att fästa ett element.
Ring tillägget affix via JavaScript:
Alternativ kan skickas via dataattribut eller JavaScript. För dataattribut, lägg till alternativnamnet till data-
, som i data-offset-top="200"
.
namn | typ | standard | beskrivning |
---|---|---|---|
offset | nummer | funktion | objekt | 10 | Pixlar att förskjuta från skärmen vid beräkning av rullningsposition. Om ett enda nummer tillhandahålls kommer offset att tillämpas i både övre och nedre riktningar. För att ge en unik, botten- och toppförskjutning, tillhandahåll bara ett objekt offset: { top: 10 } eller offset: { top: 10, bottom: 5 } . Använd en funktion när du dynamiskt behöver beräkna en offset. |
mål | väljare | nod | jQuery-element | window objektet _ |
Anger målelementet för affixet. |
.affix(options)
Aktiverar ditt innehåll som anbringat innehåll. Accepterar ett valfritt alternativ object
.
.affix('checkPosition')
Beräknar om tillståndet för fästet baserat på dimensionerna, positionen och rullningspositionen för de relevanta elementen. Klasserna .affix
, .affix-top
, och .affix-bottom
läggs till eller tas bort från det anbringade innehållet enligt det nya tillståndet. Denna metod måste anropas när måtten på det anbringade innehållet eller målelementet ändras, för att säkerställa korrekt placering av det anbringade innehållet.
Bootstraps affix-plugin avslöjar några händelser för att koppla in affix-funktionalitet.
Event typ | Beskrivning |
---|---|
affix.bs.affix | Denna händelse utlöses omedelbart innan elementet har fästs. |
avfixed.bs.affix | Denna händelse aktiveras efter att elementet har fästs. |
anbringa-top.bs.affix | Denna händelse utlöses omedelbart innan elementet har fästs upptill. |
avfixed-top.bs.affix | Denna händelse aktiveras efter att elementet har fästs upptill. |
affix-bottom.bs.affix | Denna händelse utlöses omedelbart innan elementet har fästs-botten. |
avfixed-bottom.bs.affix | Denna händelse aktiveras efter att elementet har fästs-botten. |