וועגן מאָדס

א סטרימליינד, אָבער פלעקסאַבאַל, נעמען אויף די טראדיציאנעלן דזשאַוואַסקריפּט מאָדאַל פּלוגין מיט בלויז די מינימום פארלאנגט פאַנגקשאַנאַליטי און קלוג דיפאָלץ.

סטאַטיק בייַשפּיל

ונטער איז אַ סטאַטיקלי רענדערד מאָדאַל.

לעבן דעמאָ

טאַגאַל אַ מאָדאַל דורך דזשאַוואַסקריפּט דורך געבן אַ קליק דעם קנעפּל אונטן. עס וועט רוק אַראָפּ און וועלקן אין פון די שפּיץ פון די בלאַט.

ניצן באָאָצטראַפּ-מאָדאַל

רופן די מאָדאַל דורך דזשאַוואַסקריפּט:

$ ( '#מימאָדאַל' ). מאָדאַל ( אָפּציעס )

אָפּציעס

מאַרקאַפּ

איר קענען לייכט אַקטאַווייט מאָדאַלז אויף דיין בלאַט אָן אַ איין שורה פון דזשאַוואַסקריפּט. נאָר שטעלן data-toggle="modal"אויף אַ קאָנטראָללער עלעמענט מיט אַ data-target="#foo"אָדער href="#foo"וואָס קאָראַספּאַנדז צו אַ מאָדאַל עלעמענט שייַן, און ווען קליקט, עס וועט קאַטער דיין מאָדאַל.

אויך, צו לייגן אָפּציעס צו דיין מאָדאַל בייַשפּיל, נאָר אַרייַננעמען זיי ווי נאָך דאַטן אַטריביוץ אויף די קאָנטראָל עלעמענט אָדער די מאָדאַל מאַרקאַפּ זיך.

<a class = "btn" data-toggle = "modal" href = "#myModal" > קאַטער מאָדאַל </a>    

<div class = "modal hide" id = "myModal" >  
  <דייוו קלאַס = "מאָדאַל-כעדער" > 
    <קנעפּל טיפּ = "קנעפּל" קלאַס = "נאָענט" דאַטן-אָפּזאָגן = "מאָדאַל" > × </button>   
    <h3> מאָדאַל כעדער </h3>
  </div>
  <דייוו קלאַס = "מאָדאַל גוף" > 
    <p> איין פייַן גוף ... </p>
  </div>
  <דייוו קלאַס = "מאָדאַל-פאָטער" > 
    <a href = "#" class = "btn" data-dismiss = "מאָדאַל" > נאָענט </a>   
    <a href = "#" class = "btn btn-primary" > היט ענדערונגען </a>  
  </div>
</div>

מעטהאָדס

.מאָדאַל (אָפּציעס)

אַקטאַווייץ דיין אינהאַלט ווי אַ מאָדאַל. אַקסעפּץ אַן אַפּשאַנאַל אָפּציעס object.

$ ( '#מימאָדאַל' ). מאָדאַל ({
  קלאַוויאַטור : פאַלש 
})

.modal('טאַגאַל')

מאַניואַלי טאַגאַלז אַ מאָדאַל.

$ ( '#מימאָדאַל' ). מאָדאַל ( 'טאַגאַל' )

.modal('ווייַזן')

מאַניואַלי אָפּענס אַ מאָדאַל.

$ ( '#מימאָדאַל' ). מאָדאַל ( 'ווייַזן' )

.modal('באַהאַלטן')

מאַניואַלי כיידז אַ מאָדאַל.

$ ( '#מימאָדאַל' ). מאָדאַל ( 'באַהאַלטן' )

געשעענישן

Bootstrap ס מאָדאַל קלאַס יקספּאָוזיז עטלעכע געשעענישן פֿאַר כוקינג אין מאָדאַל פאַנגקשאַנאַליטי.

$ ( '#מימאָדאַל' ). אויף ( 'פאַרבאָרגן' , פֿונקציע () {   
  // טאָן עפּעס ...
})

וועגן דראַפּדאַונז

לייג דראָפּדאָוון מעניוז צו כּמעט אַלץ אין Bootstrap מיט דעם פּשוט פּלוגין. באָאָטסטראַפּ פֿעיִקייטן פול דראָפּדאָוון מעניו שטיצן אין די נאַוובאַר, טאַבס און פּילז.

ביישפילן

דריקט אויף די דראָפּדאָוון נאַוויגאַציע לינקס אין די נאַוובאַר און פּילז אונטן צו פּרובירן דראָפּדאָוונס.

• רעגולער לינק
• דראָפּדאָוון
  • Action
  • Another action
  • Something else here
  • Separated link
• דראָפּדאָוון 2
  • Action
  • Another action
  • Something else here
  • Separated link
• דראָפּדאָוון 3
  • Action
  • Another action
  • Something else here
  • Separated link

ניצן bootstrap-dropdown.js

רופן די דראָפּדאָוונס דורך דזשאַוואַסקריפּט:

$ ( '.דראָפּדאָוון-טאַגאַל' ). דראָפּדאָוון ()

מאַרקאַפּ

צו געשווינד לייגן דראָפּדאָוון פאַנגקשאַנאַליטי צו קיין עלעמענט נאָר לייגן data-toggle="dropdown"און קיין גילטיק באָוץטראַפּ דראָפּדאָוון וועט אויטאָמאַטיש זיין אַקטיווייטיד.

<ul class = "nav nav-pills" > 
  <li class = "active" ><a href = "#" > רעגולער לינק </a></li>  
  <לי קלאַס = "דראָפּדאָוון" שייַן = "מענו1" >  
    <a class = "dropdown-toggle" data-toggle = "dropdown" href = "#menu1"> _   
      דראָפּדאָוון
      <b class = "קאַרעט" ></b> 
    </a>
    <ul class = "דראָפּדאָוון-מעניו" > 
      <li><a href = "#" > קאַמף </a></li> 
      <li><a href = "#" > אן אנדער קאַמף </a></li> 
      <li><a href = "#" > עפּעס אַנדערש דאָ </a></li> 
      <לי קלאַס = "דיווידער" ></li> 
      <li><a href = "#" > אפגעשיידט לינק </a></li> 
    </ul>
  </li>
  ...
</ul>

צו האַלטן URL ס בעשאָלעם, נוצן די data-targetאַטריביוט אַנשטאָט פון href="#".

<ul class = "nav nav-pills" > 
  <לי קלאַס = "דראָפּדאָוון" > 
    <a class = "dropdown-toggle" data-toggle = "dropdown" data-target = "#" href = "path/to/page.html"> _    
      דראָפּדאָוון
      <b class = "קאַרעט" ></b> 
    </a>
    <ul class = "דראָפּדאָוון-מעניו" > 
      ...
    </ul>
  </li>
</ul>

מעטהאָדס

$().דראָפּדאָוון()

א פּראָגראַממאַטיק אַפּי פֿאַר אַקטאַווייטינג מעניוז פֿאַר אַ געגעבן נאַוובאַר אָדער טאַבבעד נאַוויגאַציע.

די ScrollSpy פּלוגין איז פֿאַר אויטאָמאַטיש אַפּדייטינג נאַוו טאַרגאַץ באזירט אויף מעגילע שטעלע.

בייַשפּיל נאַוובאַר מיט סקראָלספּי

מעגילע די געגנט אונטן און היטן די נאַוויגאַציע דערהייַנטיקן. די דראָפּדאָוון סאַב-ייטאַמז וועט זיין כיילייטיד אויך. פּרוּווט עס!

ניצן bootstrap-scrollspy.js

רופן די סקראָלספּי דורך דזשאַוואַסקריפּט:

$ ( '# נאַוובאַר' ). סקראָלספּי ()

מאַרקאַפּ

צו לייכט לייגן סקראָלספּי נאַטור צו דיין טאַפּבאַר נאַוויגאַציע, נאָר לייגן data-spy="scroll"צו די עלעמענט איר ווילן צו שפּיאָן אויף (רובֿ טיפּיקלי דאָס וואָלט זיין דער גוף).

<body data-spy = "מעגילע" > ... </body>  

מעטהאָדס

.סקראָלספּי('דערפרישן')

ווען איר נוצן סקראָלספּי אין קאַנדזשאַנגקשאַן מיט אַדינג אָדער רימוווינג עלעמענטן פון די DOM, איר דאַרפֿן צו רופן דעם דערפרישן אופֿן ווי אַזוי:

$ ( '[דאַטן-שפּיאָן = מעגילע"]' ). יעדער ( פונקציע () {  
  וואַר $ספּיאָן = $ ( דעם ). סקראָלספּי ( 'דערפרישן' )
});

אָפּציעס

געשעענישן

דעם פּלוגין מוסיף שנעל, דינאַמיש קוויטל און פּיל פאַנגקשאַנאַליטי פֿאַר יבערגאַנג דורך היגע אינהאַלט.

בייַשפּיל טאַבס

דריקט אויף די טאַבס אונטן צו באַשטימען צווישן פאַרבאָרגן פּאַנאַלז, אפילו דורך דראָפּדאָוון מעניוז.

• היים
• פּראָפיל
• דראָפּדאָוון
  • @fat
  • @mdo

ניצן bootstrap-tab.js

געבן טאַבאַבלע טאַבס דורך דזשאַוואַסקריפּט (יעדער קוויטל דאַרף זיין אַקטיווייטיד ינדיווידזשואַלי):

$ ( '#מיין טאַב אַ' ). גיט ( פֿונקציע ( e ) {  
  ע . פאַרהיטןDefault ();
  $ ( דעם ). קוויטל ( 'ווייַזן' );
})

איר קענען אַקטאַווייט יחיד טאַבס אין עטלעכע וועגן:

$ ( '#מיטאַב אַ[הרעף="#פּראָפיל"]' ). קוויטל ( 'ווייַזן' ); // אויסקלייַבן קוויטל דורך נאָמען 
$ ( '#myTab a:first' ). קוויטל ( 'ווייַזן' ); // אויסקלייַבן ערשטער קוויטל 
$ ( '#myTab a:last' ). קוויטל ( 'ווייַזן' ); // אויסקלייַבן לעצט קוויטל 
$ ( '#myTab li:eq(2) a' ). קוויטל ( 'ווייַזן' ); // אויסקלייַבן דריט קוויטל (0-ינדעקסט) 

מאַרקאַפּ

איר קענען אַקטאַווייט אַ קוויטל אָדער פּיל נאַוויגאַציע אָן שרייבן קיין דזשאַוואַסקריפּט דורך פשוט ספּעציפיצירן data-toggle="tab"אָדער data-toggle="pill"אויף אַן עלעמענט. אַדינג די navאון nav-tabsקלאסן צו די קוויטל ulוועט צולייגן די באָאָטסטראַפּ קוויטל סטילינג.

<ul class = "נאַוו נאַוו-טאַבס" > 
  <li><a href = "#היים" data-toggle = "tab" > היים </a></li>  
  <li><a href = "#פּראָפיל" data-toggle = "tab" > פּראָפיל </a></li>  
  <li><a href = "#messages" data-toggle = "tab" > אַרטיקלען </a></li>  
  <li><a href = "#settings" data-toggle = "tab" > סעטטינגס </a></li>  
</ul>

מעטהאָדס

$().tab

אַקטאַווייץ אַ קוויטל עלעמענט און אינהאַלט קאַנטיינער. טאַב זאָל האָבן אַ data-targetאָדער אַ hrefטאַרגאַטינג אַ קאַנטיינער נאָדע אין די DOM.

<ul class = "nav nav-tabs" id = "myTab" >  
  <li class = "active" ><a href = "#home" > היים </a></li>  
  <li><a href = "#פּראָפיל" > פּראָפיל </a></li> 
  <li><a href = "#מעססאַגעס" > אַרטיקלען </a></li> 
  <li><a href = "#סעטטינגס" > סעטטינגס </a></li> 
</ul>
 
<div class = "tab-content" > 
  <div class = "tab-pane active" id = "היים" > ... </div>  
  <div class = "tab-pane" id = "פּראָפיל" > ... </div>  
  <div class = "tab-pane" id = " אַרטיקלען " > ... </div>  
  <div class = "tab-pane" id = "סעטטינגס" > ... </div>  
</div>
 
<שריפט>
  $ ( פונקציע () {  
    $ ( '#myTab a:last' ). קוויטל ( 'ווייַזן' );
  })
</script>

געשעענישן

$ ( 'אַ [דאַטן-טאָגגל ​​= "טאַב"]' ). אויף ( 'געוויזן' , פֿונקציע ( e ) {   
  ע . ציל // אַקטיווייטיד קוויטל
  ע . RelatedTarget // פרייַערדיק קוויטל
})

וועגן Tooltips

ינספּייערד דורך די ויסגעצייכנט jQuery.tipsy פּלוגין געשריבן דורך Jason Frame; Tooltips זענען אַ דערהייַנטיקט ווערסיע וואָס טאָן ניט פאַרלאָזנ זיך בילדער, נוצן css3 פֿאַר אַנאַמיישאַנז און דאַטן אַטריביוץ פֿאַר היגע טיטל סטאָרידזש.

ביישפּיל נוצן פון Tooltips

האָווער אויף די לינקס אונטן צו זען מכשירים:

ניצן bootstrap-tooltip.js

צינגל די מכשירים דורך דזשאַוואַסקריפּט:

$ ( '#עקסאַמפּלע' ). tooltip ( אָפּציעס )

אָפּציעס

מאַרקאַפּ

פֿאַר פאָרשטעלונג סיבות, די טאָאָלטיפּ און פּאָפּאָווער דאַטן-אַפּיס זענען אַפּט אין. אויב איר וואָלט ווי צו נוצן זיי נאָר ספּעציפיצירן אַ סעלעקטאָר אָפּציע.

<a href = "#" rel = "tooltip" title = "ערשטער Tooltip" > מאַך איבער מיר </a>   

מעטהאָדס

$().מכשיר עצה(אָפּציעס)

אַטאַטשיז אַ טאָאָלטיפּ האַנדלער צו אַן עלעמענט זאַמלונג.

.tooltip('ווייַזן')

ריווילז אַן עלעמענט ס מכשירים.

$ ( '# עלעמענט' ). tooltip ( 'ווייַזן' )

.tooltip('באַהאַלטן')

באַהאַלט אַן עלעמענט ס מכשירים.

$ ( '# עלעמענט' ). tooltip ( 'באַהאַלטן' )

.tooltip('טאַגאַל')

טאָגלעס אַן עלעמענט ס מכשירים.

$ ( '# עלעמענט' ). tooltip ( 'טאַגאַל' )

וועגן פּאָפּאָווערס

לייג קליין אָוווערלייז פון אינהאַלט, ווי די אויף די iPad, צו קיין עלעמענט פֿאַר האָוסינג צווייטיק אינפֿאָרמאַציע.

* ריקוויירז טאָאָלטיפּ צו זיין אַרייַנגערעכנט

בייַשפּיל האָווער פּאָווער

האָווער איבער די קנעפּל צו צינגל די פּאָפּאָווער.

ניצן bootstrap-popover.js

געבן פּאָפּאָווערס דורך דזשאַוואַסקריפּט:

$ ( '#עקסאַמפּלע' ). פּאָפּאָווער ( אָפּציעס )

אָפּציעס

מאַרקאַפּ

פֿאַר פאָרשטעלונג סיבות, די טאָאָלטיפּ און פּאָפּאָווער דאַטן-אַפּיס זענען אַפּט אין. אויב איר וואָלט ווי צו נוצן זיי נאָר ספּעציפיצירן אַ סעלעקטאָר אָפּציע.

מעטהאָדס

$().פּאָפּאָווער(אָפּציעס)

יניטיאַליזעס פּאָפּאָווערס פֿאַר אַן עלעמענט זאַמלונג.

.popover('ווייַזן')

ריווילז אַן עלעמענט פּאָווער.

$ ( '# עלעמענט' ). פּאָפּאָווער ( 'ווייַזן' )

.popover('באַהאַלטן')

כיידז אַן עלעמענטן פּאָפּאָווער.

$ ( '# עלעמענט' ). פּאָפּאָווער ( 'באַהאַלטן' )

.popover('טאַגאַל')

טאָגלעס אַן עלעמענט פּאָווער.

$ ( '# עלעמענט' ). פּאָפּאָווער ( 'טאַגאַל' )

וועגן אַלערץ

די פלינק פּלוגין איז אַ קליינטשיק קלאַס פֿאַר אַדינג נאָענט פאַנגקשאַנאַליטי צו אַלערץ.

בייַשפּיל אַלערץ

די אַלערץ פּלוגין אַרבעט אויף רעגולער פלינק אַרטיקלען און פאַרשפּאַרן אַרטיקלען.

ניצן bootstrap-alert.js

געבן דיסמיסאַל פון אַ פלינק דורך דזשאַוואַסקריפּט:

$ ( ".אַלערט" ). פלינק ()

מאַרקאַפּ

נאָר לייגן data-dismiss="alert"צו דיין נאָענט קנעפּל צו אויטאָמאַטיש געבן אַ פלינק נאָענט פאַנגקשאַנאַליטי.

<אַ קלאַס = "נאָענט " data-dismiss = " אַלערט" href = "#" > & מאל; </a>   

מעטהאָדס

$().אַלערט()

ראַפּס אַלע אַלערץ מיט נאָענט פאַנגקשאַנאַליטי. צו מאַכן דיין אַלערץ אַנימאַטעד ווען פארמאכט, מאַכן זיכער אַז זיי האָבן די .fadeאון .inקלאַס שוין געווענדט צו זיי.

.alert('נאָענט')

קלאָוזיז אַ פלינק.

$ ( ".אַלערט" ). פלינק ( 'נאָענט' )

געשעענישן

Bootstrap ס פלינק קלאַס יקספּאָוזיז עטלעכע געשעענישן פֿאַר כוקינג אין פלינק פאַנגקשאַנאַליטי.

$ ( '#מיין-אַלערט' ). בינדן ( 'פארמאכט' , פֿונקציע () {   
  // טאָן עפּעס ...
})

וועגן

טאָן מער מיט קנעפּלעך. קאָנטראָל קנעפּלעך אָדער שאַפֿן גרופּעס פון קנעפּלעך פֿאַר מער קאַמפּאָונאַנץ ווי טאָאָלבאַרס.

בייַשפּיל ניצט

ניצן די קנעפּלעך פּלוגין פֿאַר שטאַטן און טאַגאַל.

ניצן bootstrap-button.js

געבן קנעפּלעך דורך דזשאַוואַסקריפּט:

$ ( '.nav-tabs' ). קנעפּל ()

מאַרקאַפּ

דאַטן אַטריביוץ זענען ינטאַגראַל צו די קנעפּל פּלוגין. קוק די ביישפּיל קאָד אונטן פֿאַר די פאַרשידן מאַרקאַפּ טייפּס.

<!-- לייג דאַטן-toggle="קנעפּל" צו אַקטאַווייט טאַגאַלינג אויף אַ איין קנעפּל -->
<button class = "btn" data-toggle = "button" > איין טאַגאַל </button>  
 
<!-- לייג data-toggle="buttons-checkbox" פֿאַר טשעקקבאָקס נוסח טאַגאַלינג אויף btn-group -->
<div class = "btn-group" data-toggle = "קנעפּל-טשעקבאָקס" >  
  <button class = "btn" > לינקס </button> 
  <button class = "btn" > מיטל </button> 
  <button class = "btn" > רעכט </button> 
</div>
 
<!-- לייג דאַטן-טאָגלע = "קנעפּלס-ראַדיאָ" פֿאַר ראַדיאָ סטיל טאַגאַלינג אויף btn-גרופּע -->
<div class = "btn-group" data-toggle = "קנעפּל-ראַדיאָ" >  
  <button class = "btn" > לינקס </button> 
  <button class = "btn" > מיטל </button> 
  <button class = "btn" > רעכט </button> 
</div>

מעטהאָדס

$().קנעפּל('טאַגאַל')

טאַגאַלז שטופּן שטאַט. גיט דעם קנעפּל די אויסזען אַז עס איז אַקטיווייטיד.

<button class = "btn" data-toggle = "קנעפּל" > … </button>   

$().button('לאָודינג')

באַשטעטיקט קנעפּל שטאַט צו לאָודינג - דיסייבאַלז קנעפּל און סוואַפּס טעקסט צו לאָודינג טעקסט. לאָודינג טעקסט זאָל זיין דיפיינד אויף די קנעפּל עלעמענט מיט די דאַטן אַטריביוט data-loading-text.

<button class = "btn" data-loading-text = "לאָודינג שטאָפּן ..." > ... </button>   

$().button('באַשטעטיק')

רעסעץ קנעפּל שטאַט - סוואַפּס טעקסט צו אָריגינעל טעקסט.

$().קנעפּל(שטריקל)

רעסעץ קנעפּל שטאַט - סוואַפּס טעקסט צו קיין דאַטן דיפיינד טעקסט שטאַט.

<קנעפּל קלאַס = "בטן" data-complete-text = "פאַרטיק!" > ... </button>   
<שריפט>
  $ ( '.בטן' ). קנעפּל ( 'גאַנץ' )
</script>

וועגן

באַקומען באַזע סטיילז און פלעקסאַבאַל שטיצן פֿאַר קאַלאַפּסאַבאַל קאַמפּאָונאַנץ ווי אַקאָרדיאָנס און נאַוויגאַציע.

* ריקוויירז די טראַנסיטיאָנס פּלוגין צו זיין אַרייַנגערעכנט.

בייַשפּיל אַקאָרדיאַן

מיט די ייַנבראָך פּלוגין, מיר געבויט אַ פּשוט אַקאָרדיאַן נוסח ווידזשיט:

ניצן bootstrap-collapse.js

געבן דורך דזשאַוואַסקריפּט:

$ ( ". קאַלאַפּס" ). ייַנבראָך ()

אָפּציעס

מאַרקאַפּ

נאָר לייגן data-toggle="collapse"און אַ data-targetצו עלעמענט צו אויטאָמאַטיש באַשטימען קאָנטראָל פון אַ קאַלאַפּסאַבאַל עלעמענט. דער data-targetאַטריביוט אַקסעפּץ אַ CSS סעלעקטאָר צו צולייגן די ייַנבראָך. זייט זיכער צו לייגן די קלאַס collapseצו די קאַלאַפּסאַבאַל עלעמענט. אויב איר ווילט אַז עס זאָל זיין פעליקייַט עפענען, לייגן די נאָך קלאַס in.

<קנעפּל קלאַס = "btn btn-danger" data-toggle = "ייַנבראָך" דאַטן-ציל = "# דעמאָ" >   
  פּשוט קאַלאַפּסאַבאַל
</button>
 
<div id = "דעמאָ" קלאַס = "ייַנבראָך אין" > … </div>  

מעטהאָדס

.collapse (אָפּציעס)

אַקטאַווייץ דיין אינהאַלט ווי אַ קאַלאַפּסאַבאַל עלעמענט. אַקסעפּץ אַן אַפּשאַנאַל אָפּציעס object.

$ ( '#myCollapsible' ). ייַנבראָך ({
  טאַגאַל : פאַלש 
})

.collapse('טאַגאַל')

טאָגלעס אַ קאַלאַפּסאַבאַל עלעמענט צו געוויזן אָדער פאַרבאָרגן.

.collapse('ווייַזן')

ווייזט אַ קאַלאַפּסאַבאַל עלעמענט.

.collapse('באַהאַלטן')

כיידז אַ קאַלאַפּסאַבאַל עלעמענט.

געשעענישן

Bootstrap ס ייַנבראָך קלאַס יקספּאָוזיז עטלעכע געשעענישן פֿאַר כוקינג אין ייַנבראָך פאַנגקשאַנאַליטי.

$ ( '#myCollapsible' ). אויף ( 'פאַרבאָרגן' , פֿונקציע () {   
  // טאָן עפּעס ...
})

וועגן

א דזשאַנעריק פּלוגין פֿאַר סייקלינג דורך עלעמענטן. א לעבעדיקע.

בייַשפּיל קעראַסעל

היטן די סלידעשאָוו אונטן.

ערשטער טאַמנייל פירמע

קראַס דזשוסטאָ אָדיאָ, דאַפּיבוס און פאַסיליטיז אין, עגעסטאַס עגעסט ווי. דאָנעק יד עליט ניט מיר פּאָרטאַ גראַווידאַ און עגעסט מעטוס. נוללאַם יד דאָלאָר יד ניבה ולטריסיעס וועהיקולאַ וט יד עליט.

צווייטע טאַמנייל פירמע

קראַס דזשוסטאָ אָדיאָ, דאַפּיבוס און פאַסיליטיז אין, עגעסטאַס עגעסט ווי. דאָנעק יד עליט ניט מיר פּאָרטאַ גראַווידאַ און עגעסט מעטוס. נוללאַם יד דאָלאָר יד ניבה ולטריסיעס וועהיקולאַ וט יד עליט.

דריט טאַמנייל פירמע

קראַס דזשוסטאָ אָדיאָ, דאַפּיבוס און פאַסיליטיז אין, עגעסטאַס עגעסט ווי. דאָנעק יד עליט ניט מיר פּאָרטאַ גראַווידאַ און עגעסט מעטוס. נוללאַם יד דאָלאָר יד ניבה ולטריסיעס וועהיקולאַ וט יד עליט.

‹ ›

ניצן bootstrap-carousel.js

רופן דורך דזשאַוואַסקריפּט:

$ ( '.קאַראָוסעל' ). קעראַסעל ()

אָפּציעס

מאַרקאַפּ

דאַטאַ אַטריביוץ זענען געניצט פֿאַר די פריערדיקע און ווייַטער קאָנטראָלס. קוק די ביישפּיל מאַרקאַפּ אונטן.

<div id = "myCarousel" קלאַס = "קעראַסעל רוק" >  
  <!-- קאַראָוסעל זאכן -->
  <דייוו קלאַס = "קעראַסעל-ינער" > 
    <דייוו קלאַס = "אַקטיוו נומער" > … </div> 
    <דייוו קלאַס = "נומער" > … </div> 
    <דייוו קלאַס = "נומער" > … </div> 
  </div>
  <!-- קאַראָוסעל נאַוו -->
  < אַ קלאַס = "קעראַסעל-קאָנטראָל לינקס" href = "#מיקאַראָוסעל" דאַטן- רוק = "פּרעוו" > & לסאַקוו ; </a>   
  < אַ קלאַס = "קעראַסעל-קאָנטראָל רעכט" href = "#מיקאַראָוסעל" דאַטן- רוק = "ווייַטער" > & rsaquo ; </a>   
</div>

מעטהאָדס

.קאַראָוסעל (אָפּציעס)

יניטיאַליזעס די קעראַסעל מיט אַפּשאַנאַל אָפּציעס objectאון סטאַרץ סייקלינג דורך זאכן.

$ ( '.קאַראָוסעל' ). קעראַסעל ({
  מעהאַלעך : 2000 
})

.carousel('ציקל')

סיקאַלז דורך די קעראַסעל זאכן פון לינקס צו רעכט.

.carousel('פּזע')

סטאַפּס די קעראַסעל פון סייקלינג דורך זאכן.

.קאַראָוסעל(נומער)

סיקלעס די קעראַסעל צו אַ באַזונדער ראַם (0 באזירט, ענלעך צו אַ מענגע).

.carousel('prev')

סיקלעס צו די פריערדיקע נומער.

.carousel('ווייַטער')

סיקלעס צו דער ווייַטער נומער.

געשעענישן

Bootstrap ס קעראַסעל קלאַס יקספּאָוזיז צוויי געשעענישן פֿאַר כוקינג אין קעראַסעל פאַנגקשאַנאַליטי.

וועגן

א יקערדיק, לייכט עקסטענדעד פּלוגין פֿאַר געשווינד קריייטינג עלעגאַנט טיפּאַהעאַדס מיט קיין פאָרעם טעקסט אַרייַנשרייַב.

בייַשפּיל

אָנהייב טייפּינג אין די פעלד אונטן צו ווייַזן די רעזולטאַטן.

ניצן bootstrap-typeahead.js

רופן דעם טיפּ פאָרויס דורך דזשאַוואַסקריפּט:

$ ( '. טיפּאַהעאַד' ). דרוקן ()

אָפּציעס

מאַרקאַפּ

לייג דאַטן אַטריביוץ צו פאַרשרייַבן אַן עלעמענט מיט טיפּאַהעאַד פאַנגקשאַנאַליטי.

<אינפּוט טיפּ = "טעקסט" data-provide = "טיפּ פאָרויס" >  

מעטהאָדס

.typeahead (אָפּציעס)

יניטיאַליזעס אַ אַרייַנשרייַב מיט אַ טיפּאַהעאַד.